计时器setTimeout()

setTimeout()计时器，在载入后延迟指定时间后,去执行一次表达式,仅执行一次。

语法:

setTimeout(代码,延迟时间);

参数说明：

1. 要调用的函数或要执行的代码串。

2. 延时时间：在执行代码前需等待的时间，以毫秒为单位（1s=1000ms)。

当我们打开网页3秒后，在弹出一个提示框，代码如下:

<!DOCTYPE HTML>

<html>

<head>

<script type="text/javascript">

  setTimeout("alert('Hello!')", 3000 );

</script>

</head>

<body>

</body>

</html>

当按钮start被点击时，setTimeout()调用函数，在5秒后弹出一个提示框。

<!DOCTYPE HTML>

<html>

<head>

<script type="text/javascript">

function tinfo(){

  var t=setTimeout("alert('Hello!')",5000);

 }

</script>

</head>

<body>

<form>

  <input type="button" value="start" onClick="tinfo()">

</form>

</body>

</html>

要创建一个运行于无穷循环中的计数器，我们需要编写一个函数来调用其自身。在下面的代码，当按钮被点击后，输入域便从0开始计数。

<!DOCTYPE HTML>

<html>

<head>

<script type="text/javascript">

var num=0;

function numCount(){

 document.getElementById('txt').value=num;

 num=num+1;

 setTimeout("numCount()",1000);

 }

</script>

</head>

<body>

<form>

<input type="text" id="txt" />

<input type="button" value="Start" onClick="numCount()" />

</form>

</body>

</html>

任务

补充右边编辑器第12和14行，使用setTimeout()实现计数统计效果，并在文本框中显示数值。

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>计时器</title>

</head>

<script type="text/javascript">

  var num=0;

  function startCount() {

    document.getElementById('count').value=num;

    num=num+1;

    setTimeout("startCount()",1000) ;

  }

  setTimeout("startCount()",1000);

</script>

</head>

<body>

<form>

<input type="text" id="count" />

</form>

</body>

</html>

JS window对象 计时器setTimeout() setTimeout()计时器，在载入后延迟指定时间后,去执行一次表达式,仅执行一次。 语法: setTimeout(代码,延迟时间);的更多相关文章

  1. JS window对象 返回前一个浏览的页面 back()方法

    JS window对象 返回前一个浏览的页面 back()方法,加载 history 列表中的前一个 URL. 语法: window.history.back();   返回前一个浏览的页面 back ...

  2. JS Window对象 计时器setInterval() 在执行时,从载入页面后每隔指定的时间执行代码。

    计时器setInterval() 在执行时,从载入页面后每隔指定的时间执行代码. 语法: setInterval(代码,交互时间); 参数说明: 1. 代码:要调用的函数或要执行的代码串. 2. 交互 ...

  3. JS window对象详解

    window 是客户端浏览器对象模型的基类,window 对象是客户端 JavaScript 的全局对象.一个 window 对象实际上就是一个独立的窗口,对于框架页面来说,浏览器窗口每个框架都包含一 ...

  4. js window对象

    BOM的核心对象是window,它表示浏览器的一个实例. 在浏览器中,window对象是(1)通过JavaScript访问浏览器窗口的一个接口 (2)ECMAScript规定的Global对象 1.全 ...

  5. 【repost】js window对象属性和方法相关资料整理

    window对象有以下方法: open close alert confirm prompt setTimeout clearTimeout setInterval clearInterval mov ...

  6. js window对象属相和方法相关整理资料

    window对象有以下方法: open close alert confirm prompt setTimeout clearTimeout setInterval clearInterval mov ...

  7. JS window对象的top、parent、opener含义

    .top 该变更永远指分割窗口最高层次的浏览器窗口.如果计划从分割窗口的最高层次开始执行命令,就可以用top变量. .opener opener用于在window.open的页面引用执行该window ...

  8. JS window对象的top、parent、opener含义介绍 以及防止网页被嵌入框架的代码

    1.top该变更永远指分割窗口最高层次的浏览器窗口.如果计划从分割窗口的最高层次开始执行命令,就可以用top变量. 2.openeropener用于在window.open的页面引用执行该window ...

  9. JS window对象的top、parent、opener含义介绍(转载)

    1.top该变更永远指分割窗口最高层次的浏览器窗口.如果计划从分割窗口的最高层次开始执行命令,就可以用top变量. 2.openeropener用于在window.open的页面引用执行该window ...

随机推荐

  1. 13-vim-复制和粘贴-01-复制和粘贴

    1.vi中提供有一个被复制文本的缓冲区 复制命令会将选中的文字保存在缓冲区. 删除命令删除的文字会被保存在缓冲区 在需要的位置,使用粘贴命令可以将缓冲区的文字插入到光标所在位置. vi中的文本缓冲区同 ...

  2. 装完某些软件之后IE主页被https://www.hao123.com/?tn=93453552_hao_pg劫持

    今天重装电脑,装完某些软件之后发现IE主页被https://www.hao123.com/?tn=93453552_hao_pg劫持,然后百度各种解决方法都没用,甚至是修改注册表依然没啥用 最后忽然看 ...

  3. axure破解版

    axure 破解版   https://www.cnblogs.com/lianghong/p/9385233.html   授权: zdfans.com 注册码:  gP5uuK2gH+iIVO3Y ...

  4. JavaScript跨域方式总结

    1. jsonp请求 jsonp的原理是利用 script 标签的跨域特性,可以不受限制地从其他域中加载资源,类似的标签还有 img. 缺点:只支持GET请求而不支持POST等其他类型的HTTP请求. ...

  5. sql server 事务隔离性 snapshot 、read committed说明

    一. --该 read committed 默认事务隔离级别 在 systemuser修改事务未完成时 select * from [SystemUser] where id=62; 该语句是不可读取 ...

  6. 关于UEditor的使用配置（图片上传配置）

    接到新需求,需要在平台上使用富文本编辑器,我这次选择了百度的UEditor 在官网上下载l.net版本的1.4.3开发版本 http://ueditor.baidu.com/website/downl ...

  7. SVM 详解

    https://cloud.tencent.com/developer/article/1411618 (关于hinge损失函数的定义) https://zhuanlan.zhihu.com/p/61 ...

  8. 【Luogu】【关卡2-10】分治算法（2017年10月）

    任务说明:将大问题拆分为小问题,分而治之,各个击破,然后在合并回来. 取余运算||快速幂 幂次方 逆序对 南蛮图腾

  9. 第1篇Kubernetes介绍

      一.Kubernetes 介绍:     kubernetes起源 Kubernetes (K8s) 是 Google 在 2014 年发布的一个开源项目. 据说 Google 的数据中心里运行着 ...

  10. 【转载】网易极客战记官方攻略-地牢-严酷考验 B

    关卡连接:https://codecombat.163.com/play/level/the-gauntlet-b 免费试玩:https://codecombat.163.com/play 使用你的所 ...