js中的setInterval和setTimeout使用实例_基础知识

setInterval() 定义和用法

setInterval() 方法可按照指定的周期(以毫秒计)来执行函数或表达式。该方法会不停地循环调用函数,直到使用 clearInterval() 明确停止该函数或窗口被关闭。clearInterval() 函数的参数即 setInterval() 返回的 ID 值。

语法

setInterval(code,millisec[,"lang"])
code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔,以毫秒计。

返回值

一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。

使用示例:

复制代码 代码如下:

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<input type="text" id="clock" size="35" />
<script language=javascript>
var int=setInterval("clock()",50);
function clock(){
 var t=new Date();
 document.getElementById("clock").value=t;
}
</script>
</form>
<button onclick="window.clearInterval(int)">
停止 interval 事件</button>
</body>
</html>

setTimeout() 定义和用法

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,该方法与 setInterval() 方法不同的是该方法只执行一次。

语法

setTimeout(code,millisec)
code 必需。要调用的函数后要执行的 JavaScript 代码串。
millisec 必需。在执行代码前需等待的毫秒数,以毫秒计。

提示:
(1)setTimeout() 虽然是只执行一次代码。但如果许要多次调用,除了使用 setInterval() 外还可以让被执行的代码里面自身再次调用 setTimeout() 方法已达到多次执行的目的。
(2)另外setTimeout()方法也同样可以返回一个ID值,以方便使用clearInterval()方法对使用setTimeout()方法的取消。

使用示例:

复制代码 代码如下:

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<script type="text/javascript">
function timedMsg(){
 var t=setTimeout("alert('3 秒时间到!')",3000);
}
function timedMsgAways(){
 alert('3 秒时间到!');
 var t=setTimeout("timedMsgAways()",3000);
}
</script>
</head>
<body>
<form>
<input type="button" value="3 秒后警告" onClick="timedMsg()"><br />
<input type="button" value="循环 3 秒警告" onClick="timedMsgAways()">
</form>
</body>
</html>

对于这两个方法,需要注意的是如果要求在每隔一个固定的时间间隔后就精确地执行某动作,那么最好使用setInterval,而如果不想由于连续调用产生互相干扰的问题,尤其是每次函数的调用需要繁重的计算以及很长的处理时间,那么最好使用setTimeout。

时间: 2024-07-28 19:21:33

js中的setInterval和setTimeout使用实例_基础知识的相关文章

JS中的this变量的使用介绍_基础知识

JavaScript中this的使用 在JavaScript中this变量是一个令人难以摸清的关键字,this可谓是非常强大,充分了解this的相关知识有助于我们在编写面向对象的JavaScript程序时能够游刃有余. 对于this变量最要的是能够理清this所引用的对象到底是哪一个,也许很多资料上都有自己的解释,但有些概念讲的偏繁杂.而我的理解是:首先分析this所在的函数是当做哪个对象的方法调用的,则该对象就是this所引用的对象. 示例一. 复制代码 代码如下: var obj = {};

js中document.write的那点事_基础知识

记住,在载入页面后,浏览器输出流自动关闭.在此之后,任何一个对当前页面进行操作的document.write()方法将打开-个新的输出流,它将清除当前页面内容(包括源文档的任何变量或值).因此,假如希望用脚本生成的HTML替换当前页面,就必须把HTML内容连接起来赋给一个变量,使用一个document.write()方法完成写操作.不必清除文档并打开一个新数据流,一个document.write()调用就可完成所有的操作. 关于document.write()方法还有一点要说明的是它的相关方法d

Backbone.js框架中Model与Collection的使用实例_基础知识

Model关于backbone,最基础的一个东西就是model,这个东西就像是后端开发中的数据库映射那个model一样,也是数据对象的模型,并且应该是和后端的model有相同的属性(仅是需要通过前端来操作的属性). 下面就从实例来一步一步的带大家来了解backbone的model到底是什么样的一个东西. 首先定义一个html的页面: <!DOCTYPE html> <html> <head> <title>the5fire-backbone-model<

Javascript中indexOf()和lastIndexOf应用方法实例_基础知识

indexOf()方法 indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置. 注释:indexOf() 方法对大小写敏感! 注释:如果要检索的字符串值没有出现,则该方法返回 -1. 用之前的charAt()方法 var str ='www.webclks.com/archives/3309'; for(var i=0; i<str.length; i++){ if(str.charAt(i)==='/'){ alert(i); } } indexOf()方法 var str

JS中 用户登录系统的解决办法_基础知识

当用户输入 pwd 密码是 123 就跳到第二个页面,4秒后,自动跳转到第三个页面login.html 复制代码 代码如下: <html><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8"><script type="text/javascript">     //进行检查    function check

JS中处理时间之setUTCMinutes()方法的使用_基础知识

 javascript Date.setUTCMinutes()方法按照通用时间设置分钟为一个指定日期.语法 Date.setUTCMinutes(minutesValue[, secondsValue[, msValue]]) 注:括号内外的数据是可选的 下面是参数的详细信息:     minutesValue : 0到59之间的整数,表示分钟     secondsValue : 0到59之间的整数,表示秒.如果指定secondsValue参数,则还必须指定minutesValue.    

在JS中操作时间之getUTCMilliseconds()方法的使用_基础知识

 javascript Date.getUTCMilliseconds()方法按照通用时间的返回指定日期的毫秒数.通过getUTCMilliseconds返回的值是在0和999之间的一个整数.语法 Date.getUTCMilliseconds() 下面是参数的详细信息:     NA 返回值: 返回按照通用时间指定日期的毫秒数.例子: 下面的例子打印的当前时间变量hrs的毫秒部分. <html> <head> <title>JavaScript getUTCMilli

js之WEB开发调试利器:Firebug 下载_基础知识

在米随随的Blog看到有关Firebug的介绍,遂下载试用了一下,确实是比较好的工具. 一.效果开发调试利器:Firebug 下载_基础知识-电工基础知识视频下载"> 二.主要功能 Inspect and edit HTML Tweak CSS to perfection Visualize CSS metrics Monitor network activity Debug and profile JavaScript Quickly find errors Explore the DO

js中escape对应的C#解码函数 UrlDecode_基础知识

js中escape对应的C#解码函数 System.Web.HttpUtility.UrlDecode(s) //注意编码 需要注意的几点: 1.HttpUtility.UrlEncode,HttpUtility.UrlDecode是静态方法,而Server.UrlEncode,Server.UrlDecode是实例方法. 2.Server是HttpServerUtility类的实例,是System.Web.UI.Page的属性. 3.用HttpUtility.UrlEncode编码后的字符串和