javascript问题分析

<!DOCTYPE html>
<!-- lang: html -->
<html>
<!-- lang: html -->
<head>
<!-- lang: html -->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- lang: html -->
    <script type="text/javascript">
<!-- lang: html -->
     //  debugger;
<!-- lang: html -->
    if(document.readyState=="complete"){
<!-- lang: html -->
        var i = 0;
<!-- lang: html -->
        var t;
<!-- lang: html -->

<!-- lang: html -->
        function timedCount()
<!-- lang: html -->
        {
<!-- lang: html -->
            document.getElementById(‘txt‘).value=i;
<!-- lang: html -->
            i=i+1;
<!-- lang: html -->
            t=setTimeout("timedCount()",1000);
<!-- lang: html -->
        };
<!-- lang: html -->

<!-- lang: html -->
        function stopCount(){
<!-- lang: html -->
            clearTimeout(t);
<!-- lang: html -->
        };
<!-- lang: html -->
      debugger;
<!-- lang: html -->
        var a = document.getElementById("test");
<!-- lang: html -->
        a.onmouseover=function(){timedCount()};
<!-- lang: html -->
        document.getElementById("test").onmouseout=function(){stopCount()};
<!-- lang: html -->
    }
<!-- lang: html -->

<!-- lang: html -->
    </script>
<!-- lang: html -->
</head>
<!-- lang: html -->
<body >
<!-- lang: html -->
<form >
<!-- lang: html -->
    <div id="test" class="mod-spm" style="background-color:#00ff00;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 -->

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

上面的这段代码执行也是不对的,因为在加载完之前先执行了javascript,所以如果没有断点最后在控制台能看到
document.readyState==“complete”

如果添加了onload就是加载后执行javascript了

<!DOCTYPE html>
<!-- lang: html -->
<html>
<!-- lang: html -->
<head>
<!-- lang: html -->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- lang: html -->
    <script type="text/javascript">
<!-- lang: html -->
     //  debugger;
<!-- lang: html -->
     function m(){
<!-- lang: html -->
 //   if(document.readyState=="complete"){
<!-- lang: html -->
        var i = 0;
<!-- lang: html -->
        var t;
<!-- lang: html -->

<!-- lang: html -->
        function timedCount()
<!-- lang: html -->
        {
<!-- lang: html -->
            document.getElementById(‘txt‘).value=i;
<!-- lang: html -->
            i=i+1;
<!-- lang: html -->
            t=setTimeout("timedCount()",1000);
<!-- lang: html -->
        };
<!-- lang: html -->

<!-- lang: html -->
        function stopCount(){
<!-- lang: html -->
            clearTimeout(t);
<!-- lang: html -->
        };
<!-- lang: html -->
      debugger;
<!-- lang: html -->
        var a = document.getElementById("test");
<!-- lang: html -->
        a.onmouseover=function(){timedCount()};
<!-- lang: html -->
        document.getElementById("test").onmouseout=function(){stopCount()};
<!-- lang: html -->
 //   }
<!-- lang: html -->
     }
<!-- lang: html -->
    </script>
<!-- lang: html -->
</head>
<!-- lang: html -->
<body onload="m()">
<!-- lang: html -->
<form >
<!-- lang: html -->
    <div id="test" class="mod-spm" style="background-color:#00ff00;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 -->

<!-- lang: html -->
</body>
<!-- lang: html -->
</html>
时间: 2024-11-29 07:31:08

javascript问题分析的相关文章

JavaScript 性能分析新工具 OneProfile

OneProfile 是一个网页版的小工具,可以用全新的方式展示 JavaScript 性能分析的结果,帮助开发者洞悉函数调用关系,优化应用性能. 点击打开 OneProfile 背景 Chrome Dev Tools 自带的 CPU Profile 功能非常好用.用它可以方便的生成 JavaScript 的 Flame Chart. 更棒的是你可以把 Flame Chart 导出,留着下次或者拷贝到其它机器上查看,特别好奇它是怎么实现的. 但是网上关于它的文件格式以及怎么画图的文档非常稀有,所

一些有用的javascript实例分析(三)

原文:一些有用的javascript实例分析(三) 1 10 输入两个数字,比较大小 2 window.onload = function () 3 { 4 var aInput = document.getElementsByTagName("input"); 5 var aSpan = document.getElementsByTagName("span")[0]; 6 for(var i=0;i<aInput.length-1;i++){ 7 aInp

用Chrome开发者工具做JavaScript性能分析

英文原文:Zack Grossbart,编译:伯乐在线——王筱 你的网站正常运转.现在我们来让它运转的更快.网站的性能由页面载入速度和代码执行效率决定.一些服务可以让你的网站载入更快,比如压缩JS和CDN,但是让代码执行的更快你要做的事情. 代码中很小的改动都可能对性能造成巨大的影响.快速灵活的网站和可怕的“无响应脚本”对话框可能只有几行代码的差别.这篇文章告诉你如何通过用Chrome开发者工具(Chrome Developer Tools)找到这几行关键的代码. 设置一个基线 我们来看一个简单

一些有用的javascript实例分析(一)

原文:一些有用的javascript实例分析(一) 本文以http://fgm.cc/learn/链接的实例索引为基础,可参见其实际效果.分析和整理了一些有用的javascript实例,相信对一些初学者有一定的帮助.本人水平有限,有许多不足的地方还望包涵,指正.废话不多说,正文以代码开始,不在代码中死去,就在代码中重生.不经历码农,如何来做攻城狮. 1 1 控制div属性 2 //参数为对象,样式属性和值 3 var changeStyle=function(elem,attr,value){

一些有用的javascript实例分析(二)

原文:一些有用的javascript实例分析(二) 1 5 求出数组中所有数字的和 2 window.onload = function () 3 { 4 var oBtn = document.getElementsByTagName("button")[0]; 5 var oInput = document.getElementsByTagName("input")[0] 6 var oStrong = document.getElementsByTagName

JavaScript 空间分析库——JSTS和Turf【转】

https://blog.csdn.net/neimeng0/article/details/80363468 前言 项目中有管线的空间拓扑关系查询需求,在npm中检索到JSTS和Turf两个JavaScript 空间分析库. JSTS JSTS是一个符合OGC规范的简单要素空间位置判定函数JavaScript库,JSTS也是Java类库JTS的一个接口,且与OpenLayer3具有互操作性.       目前原生的OpenLayers3并不支持空间拓扑关系查询,此类库可以作为重要的补充.通过此

浏览器中Javascript单线程分析

线程这个特性对于一门语言环境来说是尤其重要的,在Java/C++环境下都提供了多线程API操作. 但在Javascript中据说代码执行时单线程的,大量计算的逻辑会阻塞浏览器HTML渲染,但setTimeout延时处理.XHR的异步请求是如何实现的, 接下来我们将逐一分析. 首先需要肯定的是浏览器中Javascript确实是单线程执行的,不信我们可以看个例子. <html> <head></head> <body> <script>setTime

Chrome开发者工具之JavaScript内存分析

内存泄漏是指计算机可用内存的逐渐减少.当程序持续无法释放其使用的临时内存时就会发生.JavaScript的web应用也会经常遇到在原生应用程序中出现的内存相关的问题,如 泄漏和溢出,web应用也需要应对 垃圾回收停顿. 尽管JavaScript使用垃圾回收进行自动内存管理,但有效的(effective)内存管理依然很重要.在这篇文章中我们将探讨分析JavaScript web应用中的内存问题.在学习有关特性时请确保尝试一下相关案例以提高你对这些工具在实践中如何工作的认识.请阅读 内存 101(M

Chrome开发者工具之JavaScript内存分析(转)

尽管JavaScript使用垃圾回收进行自动内存管理,但有效的(effective)内存管理依然很重要.在这篇文章中我们将探讨分析JavaScript web应用中的内存问题.在学习有关特性时请确保尝试一下相关案例以提高你对这些工具在实践中如何工作的认识.请阅读内存 101(Memory 101)页面来帮助你熟悉这篇文章中用到的术语.注意:我们将要用到的某些特性目前仅对Chrome Canary版浏览器可用.我们推荐使用这个版本来获得最佳的工具,以分析你的应用程序的内存问题. 你需要思考的问题

JavaScript定时器分析

一.事件循环 JavaScript是单线程,同一个时间只能做一件事情,所以执行任务需要排队.如果前一个耗时很长,那么下一个只能等待. 1)两种任务 为了更好的处理任务,JavaScript语言的设计者将任务分为两种:同步任务(synchronous)与异步任务(asynchronous). 同步任务:在主线程上排队执行的任务. 异步任务:放在"任务队列"(task queue)中,只有当主线程空了,才会将"任务队列"中的任务放到主线程中. 这就是JavaScript