计时器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. CF963

    CF963C 首先假设横向被分成p块纵向被分成q块,\(C_i\)为横向长度为\(i\)的方块个数,\(D_i\)为纵向长度为\(i\)的方块个数 \(p\times q=\)总块数T,q要是所有\( ...

  2. android中的SQLite数据库

    SQLite是android中集成的一个轻量级的数据库,该数据库支持绝大部分SQL92语法 SQLiteDatabase代表一个数据库(底层就是一个数据库文件),一旦应用程序获得了代表指定数据库的SQ ...

  3. 删除DataFrame中特定条件的行/列

    在<Python进行数据分析与挖掘实战>一书中,第10章 删除热水器不工作的数据(水流量为0并且开关机状态为“关”的数据.) import pandas as pd data=pd.rea ...

  4. 【精通css读书笔记】 第八章 布局

    学习了css布局的基础后又来翻阅<精通css>这本经典书籍,对布局有了进一步的认识. 基于浮动的布局 两列的布局仍然是使用一个元素向左浮动,一个元素向右浮动,值得注意的是要加入displa ...

  5. day02 python流程控制 while循环 格式化输出 运算符 编码

    day02 python   一.循环: while循环     while expression:         while_suite     1.break 停止当前循环(如果多个循环嵌套,  ...

  6. vs code的简单插件

    Auto Close Tag VSCode Color Info Mithril Emmet support for VS Code Open HTML in Default Browser open ...

  7. leetcode-161周赛-5248-统计【优美子数组】

    题目描述: 自己的提交:超时: class Solution: def numberOfSubarrays(self, nums, k: int) -> int: dp = [0]* (len( ...

  8. Delphi 类（TObject、TPersistent、TComponent、TControl、TWinControl、TCustomControl、TGraphicControl、TInterfacedObject）简单介绍

      TObject:    VCL中所有类的根类,即是说:VCL中所有的类/组件/控件都是从TObject中继承而来.TObject类中定义了基本的 构造方法和析构方法.   TPersistent: ...

  9. 牛客 某练习赛 Data Structure

    Data Structure 题目描述 将一个非负整数序列划分为 \(K\) 段,分别计算出各段中的整数按位或的结果,然后再把这些结果按位与起来得到一个最终结果,把这个最终结果定义为这个序列的一个 \ ...

  10. obj.offsetHeight与obj.style.height $(obj).height()与$(obj).css('height')

    相同:都可以获取obj的高度区别:(1)obj.offsetHeight可以获取外部.内嵌和内联中定义的高,而obj.style.height只能获取内联中定义的高:(2)obj.offsetHeig ...