为什么i--后直接变为0?

来源:8-17 编程练习

吉夫

2017-07-16 01:19

<!DOCTYPE html>

<html>

 <head>

  <title>浏览器对象</title>  

  <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>   

 </head>

 <body>

  <!--先编写好网页布局-->

  <h1>操作成功</h1>

  <p><span id="span"></span>秒后回到主页<a onclick="B_back()">返回</a></p>

 

  <script type="text/javascript">  

 

   //获取显示秒数的元素,通过定时器来更改秒数。

   // setTimeout(B_back,5000);

   // function B_back(){

   //     history.back();

   // }


   //让秒数从5递减到0

   i=5;

   document.getElementById("span").innerHTML=i;

   function changeSecond(){

   i--;

   document.getElementById("span").innerHTML=i;

   }

   for(a=0;a<5;a++){

   setTimeout(changeSecond,2000);

   }

   //通过window的location和history对象来控制网页的跳转。

 </script> 

</body>

</html>

原先设想是让秒数从5逐渐递减到0,但是实际运行时,秒数经过2000毫秒后立马从5变为0

http://img.mukewang.com/596a4e710001d31502630170.jpg

写回答 关注

2回答

  • 慕粉13526308623
    2017-07-16 15:50:03
    已采纳

    for(a=0;a<5;a++){

       setTimeout(changeSecond,2000);

       }

    这里相当于连续五次执行计时器 

    是连续五次调用changeSecond()函数

    所以i等于0

    这是我写的 希望对你有帮助

    <script >

     var num = 5

      document.getElementById("span").innerHTML = num

       function change(){

           num--;

        document.getElementById("span").innerHTML = num;

        if(num==0){

            window.open('http://www.imooc.com','_top');

        }

         setTimeout("change()",1000);

       }

       setTimeout("change()",1000);

    </script>

    慕粉1352... 回复吉夫

    for循环里的内容只有执行完才会进行下一次循环 for循环里只是调用changeSecond()函数 changeSecond()函数执行的效果显示在页面上 并不在for循环里等待2s在执行下一个changeSecond() for循环执行速度很快 不到1ms就能执行完5次setTimeout() 最后的确可以看成是5个changeSecond()叠加执行,还是有些误差 你可以试试for循环一亿次 输出循环结果 看看for循环的速度 个人看法 参考看看即可

    2017-07-17 10:16:19

    共 6 条回复 >

  • 吉夫
    2017-07-16 16:01:55

    <!DOCTYPE html>

    <html>

     <head>

      <title>浏览器对象</title>  

      <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>   

     </head>

     <body>

      <!--先编写好网页布局-->

      <h1>操作成功</h1>

      <p><span id="span"></span>秒后回到主页<a onclick="B_back()">返回</a></p>

     

      <script type="text/javascript">  


       //让秒数从5递减到0

       var i=5;

       document.getElementById("span").innerHTML=i;

       function changeSecond(){

       i--;

       document.getElementById("span").innerHTML=i;

       }

       var a=0

       if(a<5){

        a++;

       setTimeout(changeSecond,1000);

       }

       //通过window的location和history对象来控制网页的跳转。

     </script> 

    </body>

    </html>


JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468061 学习 · 21891 问题

查看课程

相似问题