计时器setInterval()

在执行时,从载入页面后每隔指定的时间执行代码。

语法:

setInterval(代码,交互时间);

参数说明：

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

2. 交互时间：周期性执行或调用表达式之间的时间间隔，以毫秒计（1s=1000ms）。

返回值:

一个可以传递给 clearInterval() 从而取消对"代码"的周期性执行的值。

调用函数格式(假设有一个clock()函数):

setInterval("clock()",1000)

或

setInterval(clock,1000)

我们设置一个计时器，每隔100毫秒调用clock()函数，并将时间显示出来，代码如下:

<!DOCTYPE HTML>

<html>

<head>

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

<title>计时器</title>

<script type="text/javascript">

  var int=setInterval(clock, 100)

  function clock(){

    var time=new Date();

    document.getElementById("clock").value = time;

  }

</script>

</head>

<body>

  <form>

    <input type="text" id="clock" size="50"  />

  </form>

</body>

</html>

任务

补充右边编辑器第10行，获取时间，格式"时:分:秒"，并赋值给attime。

补充右边编辑器第13行，使用setInterval()计时器来显示动态时间。

<!DOCTYPE HTML>

<html>

<head>

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

<title>定时器</title>

<script type="text/javascript">

var attime;

function clock(){

	var time = new Date();

	var hour = time.getHours();

	if(hour<10)

	{

		hour = "0"+hour;

	}

	var minu = time.getMinutes();

	if(minu<10)

	{

		minu = "0"+minu;

	}

	var sec = time.getSeconds();

	if(sec<10)

	{

		sec = "0"+sec;

	}

	attime = hour+":"+minu+":"+sec;

	document.getElementById("clock").value = attime;

}

attime = setInterval(clock,1000);

</script>

</head>

<body>

<form>

<input type="text" id="clock" size="50"  />

</form>

</body>

</html>

JS Window对象 计时器setInterval() 在执行时,从载入页面后每隔指定的时间执行代码。的更多相关文章

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

    计时器setTimeout() setTimeout()计时器,在载入后延迟指定时间后,去执行一次表达式,仅执行一次. 语法: setTimeout(代码,延迟时间); 参数说明: 1. 要调用的函数 ...

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

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

  3. js window对象

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

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

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

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

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

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

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

  7. JS window对象 取消计时器clearTimeout() setTimeout()和clearTimeout()一起使用，停止计时器。 语法: clearTimeout(id_of_setT

    取消计时器clearTimeout() setTimeout()和clearTimeout()一起使用,停止计时器. 语法: clearTimeout(id_of_setTimeout) 参数说明: ...

  8. JS window对象详解

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

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

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

随机推荐

  1. docker运行我们的容器

    docker images docker pull nginx 运行 docker images 查看Nginx镜像是否获取成功,若为如下所示即为获取成功: docker run -p 8080:80 ...

  2. Javascript高级程序设计--读书笔记之Array类型

    1.数组的lenght属性 数组的lenght属性很有特点---他不是只读的,可以同过修改这个属性来向数组的末尾添值加或删除值, 删除值 var color = ["red", & ...

  3. mavenFailed to execute goal org.apache.maven.plugins:maven-surefire-plugin解决方法

    在项目上右键==>属性==>java构建路径==>源代码,然后把几个文件夹全部删除,然后再添加文件夹中把它们从新添加,然后再maven intall,部署.

  4. linux常用命令-1系统相关命令

    hostname #计算机名 passwd #修改密码 reboot #重启 shutdown –r now #立刻重启(root用户使用) shutdown –r 10 #过10分钟自动重启(roo ...

  5. KiCAD批量修改丝印大小

    KiCAD批量修改丝印大小 1.编辑->编辑文本与图片属性 2.范围 选择封装参考,活动 首选选择 “设定为指定值”,然后选择要修改的层,输入想要修改的参数 注意:文本高度与文本宽度比例要适中, ...

  6. Java中this的基础用法

    update on 2019-07-07 在Java核心技术一书中看到调用方法时this作为隐式参数传入的. 突然间许多问题都懂了 比如:方法的多态 父类变量指向子类对象的引用 对象变量指向的实际类型 ...

  7. Lenovo E42-80安装Linux的注意事项

    Lenovo E42-80安装Linux的注意事项 https://www.cnblogs.com/dylanchu/p/9750760.html 1. 用U盘做个liveCD While makin ...

  8. ie中datepicker赋值不成功

    解决办法:删除placeholder即可 比如我代码如下:

  9. 注册Bean

    <spring源码深度解析>笔记 1.给容器中注册组件 (1).包扫描+组件注解: (2).@Bean(导入第三方包里面的组件): (3).@Import给容器中快速的导入一个组件: 2. ...

  10. jsp service bean

    //在jsp中使用后台service中方法需要在jsp页面引入service bean 1 <%@page import="com..entity.Users"%> & ...