跟几个例子吧

计时器的例子:

/**
* Created by Administrator on 2016/8/5.
*/
(function () {
function show() {
var time = new Date();
document.body.innerHTML="当前时间为"+format(time.getHours())
+":"+format(time.getMinutes())+":"+format(time.getSeconds());
}
function format(num) {
if(num>=10){
return num;
}else {
return "0"+num;
}
}
setInterval(function () {
show();
},1000);
show();
})();

进度条的例子:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.con{
width: 100%;
height: 20px;
background-color: cadetblue;
}
.bar{
height: 20px;
background-color: coral;
position: absolute;
}
.hu{
width: 100%;
text-align: center;
line-height: 20px;
position: absolute;
}
</style>
</head>
<body>
<div class="con">
<div class="bar"></div>
<div class="hu">0%</div>
</div>
<script src="main01.js"></script>
</body>
</html>

html

/**
* Created by Administrator on 2016/8/5.
*/
(function () {
var width=1;
var div=document.querySelector(".bar");
var divhu=document.querySelector(".hu");
function syBar() {
var va=width+"%";
divhu.innerHTML=va;
div.style.width=va;
}
var time=setInterval(function () {
width++;
syBar();
if(width>=100){
clearInterval(time);
}
},100);
syBar();
})();

javascript

关于进度条说一点,注意加上单位(%或px),如

var va=width+"%";
divhu.innerHTML=va;
div.style.width=va;
这三行。

js中的setInterval的更多相关文章

  1. js中setTimeout/setInterval定时器用法示例

    js中setTimeout(定时执行一次)和setInterval(间隔循环执行)用法介绍. setTimeout:在指定的毫秒数后调用指定的代码段或函数:setTimeout示例代码 functio ...

  2. js中设置setInterval的注意点

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  3. JS中的setInterval 函数体带参数f方法

    1.setInterval(function code,delaytime); 在设置自动调用执行function code时,我们可以采用下面三种方式来解决. 一.采用字符串形式:(参数不能被周期性 ...

  4. JS里设定延时:js中SetInterval与setTimeout用法

     js中SetInterval与setTimeout用法 JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操 ...

  5. JS中setInterval、setTimeout不能传递带参数的函数的解决方案

    在JS中无论是setTimeout还是setInterval,在使用函数名作为调用句柄时都不能带参数,而在许多场合必须要带参数,接下来为大家介绍具体的解决方法 在JS中无论是setTimeout还是s ...

  6. js中的setTimeout和setInterval

    在html页面中要使用自动刷新功能时,可以是使用js中setTimeout和setInterval: 一.使用方法 setTimeout的使用setTimeout('要调用的Js方法', 调用的延迟时 ...

  7. 【转】JS中setTimeout和setInterval的最大延时值详解

    前言 JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.而这篇文中主要给大家介绍的是关于JS中setTi ...

  8. Node.js中setTimeout和setInterval的使用

    Node.js和js一样也有计时器,超时计时器.间隔计时器.及时计时器,它们以及process.nextTick(callback)函数来实现事件调度.今天先学下setTimeout和setInter ...

  9. JS中setInterval、setTimeout不能传递带参数的函数的解决办法

    在JS中无论是setTimeout还是setInterval,在使用函数名作为调用句柄时都不能带参数,而在许多场合必须要带参数,这就需要想方法解决. 一.采用字符串形式:——(缺陷)参数不能被周期性改 ...

随机推荐

  1. Python菜鸟之路:sqlalchemy/paramiko进阶

    前言:ORM中的两种创建方式 数据库优先:指的是先创建数据库,包括表和字段的建立,然后根据数据库生成ORM的代码,它是先创建数据库,再创建相关程序代码 代码优先:就是先写代码,然后根据代码去生成数据库 ...

  2. Visual studio 创建文件时自动添加备注

    Visual studio 创建文件时自动添加备注 描述 要求每回添加一个类,普通类或单元测试类文件头自动添加备注, 比如:Copyright, FileName, Author and so on. ...

  3. FlashFXP上传下载

    正常情况我们的生产环境我们本地是不能直接访问的,因为网段不通,且生产环境不允许我们随便访问,但是对于我们自运维的集群我们有时候需要上去做一些操作,通过堡垒机跳转到生产机器上即可,但是我们不能通过xsh ...

  4. 关于VMAX中存储资源池(SRP)

    Storage Resource Pool中的相关元素 SRP由一个或多个数据池组成,这些数据池包含了预配置的数据(或TDAT)设备,可为创建和呈现给主机与应用程序的精简设备(TDEVS) 提供存储. ...

  5. 改善程序与设计的55个具体做法 day7

    条款18:让接口容易被正确使用,不易被误用 这里说的接口是广义上的接口,即包括但不限于函数接口.类接口.template接口等,每一种接口都是客户与你的代码进行交互的手段. 我们对客户的所谓“资质或水 ...

  6. weak 的内部实现原理

    问题 weak 变量在引用计数为0时,会被自动设置成 nil,这个特性是如何实现的? 答案 在 Friday QA 上,有一期专门介绍 weak 的实现原理.https://mikeash.com/p ...

  7. Swift协议+代理

    Swift语言开发中使用协议+代理的用法和oc中是一样的,只不过变得是语法.现在就进入swift的协议+代理. 先上个图,看看我们要实现的效果:  首先是第一个页面,然后点击到第二个页面,最后点击返回 ...

  8. pygame躲敌人的游戏

    #first.py# coding=utf- import pygame from pygame.locals import * from sys import exit from util impo ...

  9. Data Structure Array: Maximum of all subarrays of size k

    http://www.geeksforgeeks.org/maximum-of-all-subarrays-of-size-k/ #include <iostream> #include ...

  10. wget 监控web服务器

    wget --timeout=$timeout --tries=$times $url -q &>/dev/null --timeout=number 设定超时时间 --tries=nu ...