ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

BOM-使用定时器

2019-03-25 14:54:40  阅读:165  来源: 互联网

标签:执行 定时器 setInterval 代码 BOM 使用 var setTimeout 方法


window对象包含4个定时器专用方法,说明如下表所示,使用它们可以实现代码定时运行,避免连续执行,这样可以设计动画

方法 说明
setInterval() 按照指定的周期,(以毫秒为单位)来调用函数或计算表达式      循环执行
setTimeout() 在指定的毫秒数后调用函数或计算表达式           执行一次
clearInterval() 取消由setInterval()方法生成的定时器对象
clearsetTimeout() 取消由setTimeout()方法生成的定时器对象

 

 

setTimeout()方法

  setTimeout()方法能够在指定的时间段后执行特定代码,用法如:

  var o=setTimeout(code,delay)

    参数code表示要延迟执行的代码字符串,该字符串语句可以在window环境下执行,如果包含多个语句,应该使用分号进行分割。

  delay表示延迟的时间,以毫秒为单位,该方法返回的值是一个TimerID,这个ID编号指向延迟执行的代码控制句柄,如果把这个句柄

  传递给clearTimeout()方法,则会取消代码的延迟执行。

      

var p=document.getElementsByTagName("p")[0];
p.onclick=function(){
    var b=setTimeout(function(){
        alert(p.style.color="red");
    },5000);

     clearTimeout(b);         //清除timeout延迟
}

 

setTimeout()方法的第1个参数虽然是字符串,但是我们也可以把javascript代码封装在一个函数体内,然后把喊出引用作为参数传递给setTimeout()方法,

等待延迟调用,这样就避免了传递字符串的疏漏和麻烦。注意:函数可以作为参数,作为值,作为表达式

 

 

setInterval()方法

  使用setTimeout()方法模拟循环执行指定代码,不如直接setInterval()方法来实现,setInterval()方法能够周期性执行指定的代码,如果不加以处理,那么该方法将会被持续

执行,知道浏览器窗口关闭,或者跳转到其他页面为止。用法如下

  var a=setInterval(code,Interval);

  该方法的用法与setTimeout()方法基本相同,其中参数code表示要周期执行的代码字符串,而Interval参数表示周期执行的时间间隔,以毫秒为单位,该方法返回的值是一个TimerID

,这个ID编号指向对当前周期函数的执行引用,利用该值对计时器进行访问,如果把这个值传递给clearInterval()方法,则会强制取消周期性执行的代码。

var p=document.getElementsByTagName("p")[0];
var out=setInterval(f,1000);
var i=0;
function f(){
    p.innerText=i++;
    if(i>10){
       clearInterval(out);
       alert("10秒钟已经到了");
    }
}

 setTimeout和setInterval方法在用法上有几分相似,不过两者的作用区别也很明显,setTimeout方法主要用来延迟代码执行的,而setInterval方法主要实现周期性执行代码。

 

 

标签:执行,定时器,setInterval,代码,BOM,使用,var,setTimeout,方法
来源: https://www.cnblogs.com/xiaowie/p/10593624.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有