javascript加载顺序问题(二)

<!DOCTYPE html>
<!-- lang: html -->
<html>
<!-- lang: html -->
<head>
<!-- lang: html -->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- lang: html -->
</head>
<!-- lang: html -->
<body >
<!-- lang: html -->
<form>
<!-- lang: html -->
    <div  class="test" style="background-color:#00ff00;height:400px;width:400px" >
<!-- lang: html -->
        <div></div>
<!-- lang: html -->
        <div></div>
<!-- lang: html -->
    </div>
<!-- lang: html -->
    <div class="test" style="background-color:#ff0000;height:400px;width:400px" >
<!-- lang: html -->
        <div></div>
<!-- lang: html -->
        <div></div>
<!-- lang: html -->
    </div>
<!-- lang: html -->
    <input type="button" value="开始计时!" >
<!-- lang: html -->
    <input type="text" id="txt">
<!-- lang: html -->
</form>
<!-- lang: html -->
<script type="text/javascript">
<!-- lang: html -->
    var t;
<!-- lang: html -->
    var t1;
<!-- lang: html -->
    var m = 0;
<!-- lang: html -->
    var temp = 0;
<!-- lang: html -->

<!-- lang: html -->
            function timedCount(n) {
<!-- lang: html -->
                if (n==0){
<!-- lang: html -->
                    document.getElementById(‘txt‘).value = m;
<!-- lang: html -->
                    m = m+1;
<!-- lang: html -->
                }
<!-- lang: html -->
                else{
<!-- lang: html -->
                    document.getElementById(‘txt‘).value = temp;
<!-- lang: html -->
                    temp = temp+1;
<!-- lang: html -->
                }
<!-- lang: html -->

<!-- lang: html -->
                t = setTimeout("timedCount("+n+")", 100);
<!-- lang: html -->

<!-- lang: html -->
            };
<!-- lang: html -->

<!-- lang: html -->
            function stopCount() {
<!-- lang: html -->
                clearTimeout(t);
<!-- lang: html -->
            };
<!-- lang: html -->

<!-- lang: html -->
  /*    for (var j=0; j<2; j++){
<!-- lang: html -->
    document.getElementsByClassName("test")[j].onmouseover=function(){timedCount(j)};
<!-- lang: html -->
    document.getElementsByClassName("test")[j].onmouseout=function(){stopCount()};
<!-- lang: html -->
    }*/
<!-- lang: html -->
            document.getElementsByClassName("test")[0].onmouseover=function(){timedCount(0)};
<!-- lang: html -->
       //    document.getElementsByClassName("test")[j].onmouseover=function(){testedTime()};
<!-- lang: html -->
            document.getElementsByClassName("test")[0].onmouseout=function(){stopCount()};
<!-- lang: html -->

<!-- lang: html -->
            document.getElementsByClassName("test")[1].onmouseover=function(){timedCount(1)};
<!-- lang: html -->
            document.getElementsByClassName("test")[1].onmouseout=function(){stopCount()};
<!-- lang: html -->
   //    }
<!-- lang: html -->
  //  }
<!-- lang: html -->

<!-- lang: html -->
</script>
<!-- lang: html -->
</body>
<!-- lang: html -->
</html>

如果是上面这样的话,可以分别在两个不同区域计算时间,但是如果用循环的话,就会有问题。不明其中的原理。

时间: 2024-10-02 11:30:43

javascript加载顺序问题(二)的相关文章

javascript在html中的加载顺序

参考:[1]http://coolshell.cn/articles/9749.html(酷壳) [2]http://shaozhuqing.com/?p=2756 颜色标注分别来自于链接地址内容 通常来说,浏览器对于Javascript的运行有两大特性:1)载入后马上执行,2)执行时会阻塞页面后续的内容(包括页面的渲染.其它资源的下载).于是,如果有多个js文件被引入,那么对于浏览器来说,这些js文件被被串行地载入,并依次执行. 因为javascript可能会来操作HTML文档的DOM树,所以

html css javascript 加载的顺序

html /css /javascript 这三者的加载顺序影响整个页面的加载速度.而加载速度的快慢直接影响pv(访问量),而且会影响经济收入.在大网站中,可能打开速度快一秒,一年能多带来上亿的收入.所以我们一定要重视. 一.总体原则 加载的总体原则是顺序加载,即从页面的head到body结束顺序加载.浏览器发送请求,服务器返回了这整个页面的代码.所以,下一步是对这个页面代码进行渲染. 二.加载顺序 如果结构是这样写的: 首先会加载link里面的css文件.但是在这里要记住,css文件和imag

javascript不依赖JS加载顺序事件对象实现

背景: 在现在WEB开发中,稍复杂一点的页面,都会涉及到多个模块,尤其是类似seajs.LABjs.requireJS等模块工具出来后,前端开发者分模块开发已经慢慢变成一种习惯了,但是多个模块间的常常有各种交集,需要通信.需要互相调用,这时监听者模式便是必不可少的一种设计模式了,在前端表现事件操作.backbone和jquery都有提供了很好的事件处理方式. 但是,真正开发需求的时候我们常常会遇到文件加载顺序跟事件监听与更新不一致的需求,比如说:在一个视频网站里面,有一个视频处理的JS模块和用户

ResourceDictionary主题资源替换(二) :通过加载顺序来覆盖之前的主题资源

之前的ResourceDictionary主题资源替换(一)通过加载顺序来覆盖之前的主题资源,介绍了WPF框架对ResourceDictionary资源的合并规则. 此篇介绍一种在编译期间,实现资源替换的方案 前言 如下图,项目中存在俩个主题资源字典,我们想通过配置一键修改项目的主题. 首先,我们默认使用的是灰色主题 添加项目属性文件 新建文件Themes.props(主题设置), 并添加当前主题版本: 1 <Project> 2 <PropertyGroup> 3 <The

(转)JS加载顺序

原文:http://blog.csdn.net/dannywj1371/article/details/7048076 JS加载顺序 做一名合格的前端开发工程师(12篇)--第一篇 Javascript加载执行问题探索 楼主做前端开发一年多了,对前端的见解还是多多少少有一点的,今天特拿出来跟大家分享分享. 做前端开发少不了各种利器.比如我习惯用的还是Google浏览器和重型武器Fiddller. 一: 原始情况 首先大家看看如下的代码: 1 <%@ Page Language="C#&qu

(转载)web.xml 中的listener、 filter、servlet 加载顺序及其详解

首先可以肯定的是,加载顺序与它们在 web.xml 文件中的先后顺序无关.  但不会因为 filter 写在 listener 的前面而会先加载 filter.  最终得出的结论是:listener -> filter -> servlet 同时还存在着这样一种配置节:context-param,它用于向 ServletContext 提供键值对,即应用程序上下文信息.我们的 listener, filter 等在初始化时会用到这些上下文中的信息,那么 context-param 配置节是不是

服务器启动时Webapp的web.xml中配置的加载顺序

一 1.启动一个WEB项目的时候,WEB容器会去读取它的配置文件web.xml,读取<listener>和<context-param>两个结点. 2.紧急着,容创建一个ServletContext(servlet上下文),这个web项目的所有部分都将共享这个上下文. 3.容器将<context-param>转换为键值对,并交给servletContext. 4.容器创建<listener>中的类实例,创建监听器. 二  Load-on-startup Lo

java web.xml listener servlet 和filter的加载顺序

在项目中总会遇到一些关于加载的优先级问题,近期也同样遇到过类似的,所以自己查找资料总结了下,下面有些是转载其他人的,毕竟人家写的不错,自己也就不重复造轮子了,只是略加点了自己的修饰. 首先可以肯定的是,加载顺序与它们在 web.xml 文件中的先后顺序无关.即不会因为 filter 写在 listener 的前面而会先加载 filter. 最终得出的结论是:listener -> filter -> servlet 同时还存在着这样一种配置节:context-param,它用于向 Servle

怎么样加快JavaScript加载和执行效率

概览 无论当前 JavaScript 代码是内嵌还是在外链文件中,页面的下载和渲染都必须停下来等待脚本执行完成.JavaScript 执行过程耗时越久,浏览器等待响应用户输入的时间就越长.浏览器在下载和执行脚本时出现阻塞的原因在于,脚本可能会改变页面或 JavaScript 的命名空间,它们对后面页面内容造成影响.一个典型的例子就是在页面中使用document.write(). JavaScript 代码内嵌示例 <html> <head> <title>Source