js中的setInterval
跟几个例子吧
计时器的例子：
/**
* 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的更多相关文章
- js中setTimeout/setInterval定时器用法示例
js中setTimeout(定时执行一次)和setInterval(间隔循环执行)用法介绍. setTimeout:在指定的毫秒数后调用指定的代码段或函数:setTimeout示例代码 functio ...
- js中设置setInterval的注意点
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- JS中的setInterval 函数体带参数f方法
1.setInterval(function code,delaytime); 在设置自动调用执行function code时,我们可以采用下面三种方式来解决. 一.采用字符串形式:(参数不能被周期性 ...
- JS里设定延时:js中SetInterval与setTimeout用法
js中SetInterval与setTimeout用法 JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操 ...
- JS中setInterval、setTimeout不能传递带参数的函数的解决方案
在JS中无论是setTimeout还是setInterval,在使用函数名作为调用句柄时都不能带参数,而在许多场合必须要带参数,接下来为大家介绍具体的解决方法 在JS中无论是setTimeout还是s ...
- js中的setTimeout和setInterval
在html页面中要使用自动刷新功能时,可以是使用js中setTimeout和setInterval: 一.使用方法 setTimeout的使用setTimeout('要调用的Js方法', 调用的延迟时 ...
- 【转】JS中setTimeout和setInterval的最大延时值详解
前言 JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.而这篇文中主要给大家介绍的是关于JS中setTi ...
- Node.js中setTimeout和setInterval的使用
Node.js和js一样也有计时器,超时计时器.间隔计时器.及时计时器,它们以及process.nextTick(callback)函数来实现事件调度.今天先学下setTimeout和setInter ...
- JS中setInterval、setTimeout不能传递带参数的函数的解决办法
在JS中无论是setTimeout还是setInterval,在使用函数名作为调用句柄时都不能带参数,而在许多场合必须要带参数,这就需要想方法解决. 一.采用字符串形式:——(缺陷)参数不能被周期性改 ...
随机推荐
- python SimpleHTTPServer 快速共享文件
简单介绍 通过一个python命令快速共享文件给他人. 操作步骤 1.打开cmd命令行,切换到需要共享文件的目录,执行命令 python -m SimpleHTTPServer . 2.打开浏览器,在 ...
- Java进阶学习：JSON解析利器JackSon
Java:JSON解析利器JackSon JackSon基础 1.Maven项目引入 <!-- https://mvnrepository.com/artifact/org.codehaus.j ...
- 如何写PHP规范注释
所有的文档标记都是在每一行的 * 后面以@开头.如果在一段话的中间出来@的标记,这个标记将会被当做普通内容而被忽略掉. @access 该标记用于指明关键字的存取权限:private.p ...
- vim终端配色（非gui版本）——Monokai
啥也别说,先上图. 具体配置: 1. 将molokai.vim文件(下面贴出)放到 ~/.vim/colors 目录下,如没有此文件夹需自行创建. 提示:~ 代表用户主目录,如我的用户名是 akaed ...
- iOS App被拒原因以及解决方案总结。
Guideline 1.2 - Safety - User Generated Content Your app enables the display of user-generated conte ...
- 常见SQL函数需要注意的细节
版权声明:本文为博主原创文章,未经博主允许不得转载. 这是一位牛人让我们思考的问题,说实话当时真蒙了,函数虽然明白,但细化到这种程度,真的是叫不准啊,下面是几道比较典型的问题,和本人做的实验,不一定准 ...
- DELPHI中四种EXCEL访问技术实现
一.引言 EXCEL在处理中文报表时功能非常强大,EXCEL报表访问也是信息系统开发中的一个重要内容,本文总结以往开发中所用到的几中EXCEL文件访问方法,在实际工作中也得到了很好的验证,本文列举了其 ...
- 图像处理检测方法 — SIFT和SURF
0.特征与匹配方法总结汇总对比 参考网址:http://simtalk.cn/2017/08/18/%E7%89%B9%E5%BE%81%E4%B8%8E%E5%8C%B9%E9%85%8D/#ORB ...
- STL list链表的用法详解
本文以List容器为例子,介绍了STL的基本内容,从容器到迭代器,再到普通函数,而且例子丰富,通俗易懂.不失为STL的入门文章,新手不容错过! 0 前言 1 定义一个list 2 使用list的成员函 ...
- AMD模块定义规范
AMD 即Asynchronous Module Definition,中文名是“异步模块定义”的意思.它是一个在浏览器端模块化开发的规范,服务器端的规范是CommonJS. 模块将被异步加载,模 ...