• 各种定时器总结


    一次性定时器

      用以指定在一段特定的时间后执行某段程序。

      setTimeout():

      格式:[定时器对象名=] setTimeout(“<表达式>”,毫秒)

      功能:执行<表达式>一次。

      例子:

    代码如下:

    <!DOCTYPE html>
    <html>
      <head>
        <title>timer1.html</title>
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
        <script type="text/javascript">
         function count()
         {
             setTimeout("alert('执行成功!')",7000);
         }
        </script>
      </head>
      <body>
        <input type="button" value="点击我啊" onclick="count();">
      </body>
    </html>

    周期性定时器

      以一定的时间为间隔,不断地重复执行表达式。

      setInterval():

      格式:[定时器对象名=] setInterval(“<表达式>”,毫秒)

      功能:重复执行<表达式>,直至窗口、框架被关闭或执行clearInterval。

      clearInterval():

      格式:clearInterval(定时器对象名)  

      功能:终止定时器

      例子:

    代码如下:

    <!DOCTYPE html>
    <html>
      <head>
        <title>timer2.html</title>
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
        <script type="text/javascript">
        var sec = 0;
        var timer = setInterval("count();",1000);//页面加载的时候即开始计时
         function count()
         {
            document.getElementById("num").innerHTML = sec++;
         }
         function stopCount()
         {
             clearInterval(timer);//停止定时器的运行
         }
        </script>
      </head>
      <body>
        <font color="red" id="num">0</font>
        <input type="button" value="停止" onclick="stopCount();">
      </body>
    </html>

    使用定时器实现JavaScript的延期执行或重复执行 window对象提供了两个方法来实现定时器的效果,分别是

    window.setTimeout()和window.setInterval。其中前者可以使一段代码在指定时间后运行;而后者则可以使一段代码每过指定时间就运行一次。 它们的原型如下: window.setTimeout(expression,milliseconds); window.setInterval(expression,milliseconds); 其中expression可以是字符串,也可以是函数名。是字符串的时候可以带参数,函数名不能带参数,如果带上参数就直接执行函数了,不会延时。

    function hello (){
    
    console.log('I am dada'); //alert('I am ' + name);
    
    //setTimeout(arguments.callee,2000);
    
    } setTimeout(hello,5000);//5秒后执行 setTimeout('hello()',3000);//3秒后执行
    
    setTimeout(hello(),8000);//立刻执行

    第一种情况是函数名,但是带不了参数

    第二种情况是字符串,可执行的js代码,可以带参数,但是性能上比函数名差

    第三种是调用函数,直接执行

    所以如果想要穿参数,但是又不想通过字符串的形式调用,可以自己来写一个方法:

    function _hello(_name){
    
    return function(){
    
    hello2(_name);
    
    }
    
    }
    
    setTimeout(_hello(name),7000);//立刻执行

    一、setTimeout

    setTimeout(function(){
    
    //要执行的代码
    
    },200);

    指隔200ms后,定时器代码被添加到队列中,等待JavaScript进程空闲后,代码才执行

    二、setInterval

    1、上面代码是指每隔200ms就创建一个执行代码的定时器
    2、当使用setInterval时,仅当(在队列中)没有该定时器的任何其他代码实例时,才将定时器代码添加到队列中,引用JavaScript高级程序设计第二版书中语句(即:当前一个定时器代码执行时,紧跟后面的第一个定时器代码将添加到队列中,等待执行,再后面的定时器代码不会添加到队列中)

    用setInterval来执行反复的行为的时候会遇到一个问题:

    当定时器代码执行时间(假如需要600ms才执行完)超过指定间隔(这里是200ms),那么某些定时器代码就会被跳过(即后面的定时器代码不会被添加到队列中),前一个定时器代码执行完毕后,队列中的定时器代码立刻执行,各定时器之间的代码执行没有间隔。这时,需要使用链式setTimeout。

    这样做的好处是:前一个定时器要执行的代码执行完且等待200ms后,才创建一个新的定时器,并把定时器代码添加到队列中执行即:不会出现定时器代码被跳过的情况;定时器之间的代码执行可以有间隔(根据自己设置)。

    setTimeout(function(){
    
    //要执行的代码
    
    setTimeout(arguments.callee,2000);
    
    },2000);
    
    setInterval(function(){
    
    //要执行的代码
    
    },200);
  • 相关阅读:
    Linux 如何通过命令查看一个文件的某几行(中间几行或最后几行)
    linux 定义变量 ,添加变量值
    Linux下的vi编辑命令中查找·替换详解
    linux vi 块操作、多窗口
    linux 磁盘 分区、格式化、挂载
    linux 重名名、删除文件操作
    linux vi
    linux 文件查阅 cat、more、less、tail
    linux ls touch、umask、 chattr
    linux 目录配置
  • 原文地址:https://www.cnblogs.com/yingleiming/p/7611610.html
Copyright © 2020-2023  润新知