setTimeout和setInterval的使用
2016-02-17 00:00
309 查看
摘要: setTimeout和setInterval的使用与清除
setTimeout和setInterval的语法相同。它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码。
不过这两个函数还是有区别的,setInterval在执行完一次代码之后,经过了那个固定的时间间隔,它还会自动重复执行代码,而setTimeout只执行一次那段代码。
区别:
window.setTimeout("function",time);//设置一个超时对象,只执行一次,无周期
window.setInterval("function",time);//设置一个超时对象,周期='交互时间'
停止定时:
window.clearTimeout(对象) 清除已设置的setTimeout对象
window.clearInterval(对象) 清除已设置的setInterval对象
代码如下:
一旦打开了此页面,那么就会3秒钟后显示时间,且只显示一次
一旦打开了此页面,那么就会每隔3秒钟显示换一次时间,点击停止按钮就会停止打印时间
setInterval 不断地执行指定代码直到调用clearInterval清除定时器对象
setTimeout 执行一次指定代码,使用clearTimeout清除定时器对象
setInterval和setTimeout都返回定时器对象标识符,用于clearInterval和clearTimeout调用
setTimeout和setInterval的语法相同。它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码。
不过这两个函数还是有区别的,setInterval在执行完一次代码之后,经过了那个固定的时间间隔,它还会自动重复执行代码,而setTimeout只执行一次那段代码。
区别:
window.setTimeout("function",time);//设置一个超时对象,只执行一次,无周期
window.setInterval("function",time);//设置一个超时对象,周期='交互时间'
停止定时:
window.clearTimeout(对象) 清除已设置的setTimeout对象
window.clearInterval(对象) 清除已设置的setInterval对象
代码如下:
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>setTimeout</title> </head> <body> </body> <script> setTimeout("showTime()", 3000); function showTime() { var today = new Date(); console.log("The time is: " + today.toString()); } </script> </html>
一旦打开了此页面,那么就会3秒钟后显示时间,且只显示一次
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>setInterval</title> </head> <body> <button id="btn">停止</button> </body> <script> var inter=0; inter=setInterval(function(){ var today = new Date(); console.log("The time is: " + today.toString()); }, 3000); var btn = document.getElementsByTagName("button")[0]; btn.addEventListener("click",function(){ console.log("停止inter"); clearInterval(inter); },false); </script> </html>
一旦打开了此页面,那么就会每隔3秒钟显示换一次时间,点击停止按钮就会停止打印时间
setInterval 不断地执行指定代码直到调用clearInterval清除定时器对象
setTimeout 执行一次指定代码,使用clearTimeout清除定时器对象
setInterval和setTimeout都返回定时器对象标识符,用于clearInterval和clearTimeout调用
相关文章推荐
- 浅谈JavaScript中setInterval和setTimeout的使用问题
- setInterval()和setTimeout()的用法和区别示例介绍
- JavaScript基于setTimeout实现计数的方法
- alert中断settimeout计时功能
- 浅谈setTimeout 与 setInterval
- setTimeout()递归调用不加引号出错的解决方法
- setTimeout()与setInterval()方法区别介绍
- setTimeout内不支持jquery的选择器的解决方案
- js超时调用setTimeout和间歇调用setInterval实例分析
- setTimeout的延时为0时多个浏览器的区别
- javascript setTimeout和setInterval计时的区别详解
- 定时器(setTimeout/setInterval)调用带参函数失效解决方法
- 关于setInterval、setTimeout在jQuery中的使用注意事项
- setInterval 和 setTimeout 用法
- setTimeout-的执行时机
- setInterval的返回值类型为什么为数值?
- js的setTimeout使用问题
- PHP页面延迟跳转
- 纯js发送验证码,简单的倒计时
- nodejs学习笔记 -- 全局对象与全局变量