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方法主要实现周期性执行代码。

BOM-使用定时器的更多相关文章

  1. BOM以及定时器

    一.BOM 1.操作浏览器的一些方法 (浏览器对象模型) 2.window是is中的顶级变量,是一个全局的变量,所有人都可以访问到它,基本 的方法和属性 (document,alert,console ...

  2. 13 -1 BOM和定时器

    一 BOM JavaScript基础分为三个部分: ECMAScript:JavaScript的语法标准.包括变量.表达式.运算符.函数.if语句.for语句等. DOM:文档对象模型,操作网页上的元 ...

  3. BOM心得-定时器

    写在前面的话:之前一直以为定时器的返回值是Object类型,所以timer初始化也是写null,今天发现返回值是number,进而发觉这个返回值代表的是定时器的索引,指代这是第几个定时器 个人觉得只用 ...

  4. BOM之定时器

    JavaScript中的时间是通过定时器控制的,他们分别是window.setInterval和window.setTimeout,我们当然可以省略window,直接使用方法名称调用. 一     s ...

  5. JS中定时器的返回数值ID值

    定时器会返回一个数字值id,可以由clearInterval(id)或clearTimeout(id)来实现对对应定时器的清除. setInterval()/setTimeout()BOM中的Wind ...

  6. web前端面试第一次[定时器]

    BOM中定时器--计时器 定时器参数两个:(函数,时间(单位ms(1000ms=1s))) 时间设置1s,每过1s执行一次函数 //设置定时器 setInterval(funtion(){ alert ...

  7. 前端3 — js — BOM没完( 不了解也行 )

    1.js是什么? -- 英文全称javascript javaScript(简称"JS") 是一种具有函数优先的轻量级,解释型或即时编译型的编程语言.虽然它是作为开发Web页面的脚 ...

  8. Web前端学习路线

    第一阶段: HTML+CSS:HTML进阶.CSS进阶.div+css布局.HTML+css整站开发. JavaScript基础:Js基础教程.js内置对象常用方法.常见DOM树操作大全.ECMAsc ...

  9. 关于web前端的学习路线

    第一阶段: HTML+CSS:HTML进阶.CSS进阶.div+css布局.HTML+css整站开发. JavaScript基础:Js基础教程.js内置对象常用方法.常见DOM树操作大全.ECMAsc ...

  10. (1)写给Web初学者的教案-----学习Web的知识架构

    1:学习Web的知识架构 前文中我们简单的介绍了一些关于Web的基本知识,这里任老师再次强调一下凡是用浏览器打开的网站我们就称之为Web应用程序(B/S结构).除此之外其它需要下载安装的软件或是手机  ...

随机推荐

  1. vs2017 xamarin新建单独UWP类库提示不兼容

    One or more projects are incompatible with UAP,Version=v10.0 (win10-arm). One or more projects are i ...

  2. django drf 动态权限配置和动态seriaizer_class配置

    可以通过重写get_permissions方法和get_serializers_class方法来实现动态的配置权限和序列化 VIewDemo class RegUserSet(mixins.Creat ...

  3. BitAdminCore框架更新日志20180518

    20180518更新内容 1.重构调整QQ登录代码,使用JObject,减少代码,增加access_token自动续期(未测试). 2.重构调整微信登录代码,使用JObject,减少代码,增加acce ...

  4. XML文件之创建

    1.创建XML文档对象XmlDocument doc=new XmlDocument() 2.创建XML根节点变量XmlElement xmlElement 3.判断XML文件是否已经存在 1)若存在 ...

  5. .NET Entity Framework (with Oracle ODP.NET)

    一.前言 1.Entity Framework是什么? Entity Framework是微软对ORM框架的实现.类似的实现也有其它方式,如DevExpress 的XPO(eXpress Persis ...

  6. 获取分组后统计数量最多的纪录;limit用法;sql执行顺序

    CREATE TABLE emp(id INT PRIMARY KEY,NAME VARCHAR(11),dep_id INT ,salary INT); CREATE TABLE dept(id I ...

  7. Exp2 后门原理与实践 20164321 王君陶

    Exp2 后门原理与实践 20164321 王君陶 一.实验内容 基础问题回答: 1.例举你能想到的一个后门进入到你系统中的可能方式? 答:通过漏洞,点击陌生链接,或者浏览不良网页挂马. 2.例举你知 ...

  8. python中 使用join()方法 对各种数据类型中元的素进行合并拼接

    "连接符".join(列表或元组或字符串或字典) 返回的是一个使用连接符进行拼接的字符串 如果对象是列表,元组,就是以一个下标元素为单位进行拼接 如果对象是字符串,就是一个单词元素 ...

  9. 一,PHP会话机制---cookie

    1,  什么是会话 会话可简单理解为:用户打开一个浏览器,点击多个超链接,访问服务器多个web资源,然后关闭浏览器,整个过程称之为一个会话. 2,  cookie技术 cookie(小甜饼)是客户端技 ...

  10. Slope one—个性化推荐中最简洁的协同过滤算法

    Slope One 是一系列应用于 协同过滤的算法的统称.由 Daniel Lemire和Anna Maclachlan于2005年发表的论文中提出. [1]有争议的是,该算法堪称基于项目评价的non ...