javascript计时器频率设置（js中计时器的用法）
一些例题
1.显示当前的时间
function showdate( ){
var d = new date(); //获取当前时间
var year = d.getfullyear(); //获取当前年份
var month = d.getmonth() + 1; //获取当前月份，注意加1
var date = d.getdate(); //获取当前日期
var week = d.getday(); //获取星期，因为0代表周日，所以需要if判断一下
if( week == 0 ){
week = “周日”;
}
var hour = d.gethours(); //获取小时
var min = d.getminutes(); //获取分钟
var sec = d.getseconds(); //获取秒
return year + “年” + month + “月” + date + “日 星期” + week + ” ” + hour + “:” + min + “:” + sec; //将它们组合起来输出
}
alert( showdate() ); //最后直接调用showdate函数即可
注意引号、分号等标点符号一定要用英文的
运行结果如下：
2.setdate()和getdate()封装一个函数，可以根据输入的数值n（天数）显示n天后的时间
分析：先获取当前时间，再获取天数，再用天数加上n天
function numofdate( n ){ //n天后
var d = new date(); //获取当前时刻
var date = d.getdate(); //取出天数
d.setdate( date + n ); //加上n天
return d;
}
alert( numofdate(2) );运行结果如下：
计时器
setinterval()
格式：
setinterval( 函数(或匿名函数),毫秒数 ); 或者
setinterval( function(){ } , 毫秒数 ); 只不过一个是写了函数名，一个是直接定义了函数
功能：每隔所传参数的毫秒数，就调用一次所传参数的函数
返回值：当前页面上对于这个定时器的唯一标识，定时器的id
有了定时器的id我们就可以取消定时器，下面会讲到
举个小例子：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>document</title>
<script type = "text/javascript">
var i = 0;
function show(){ //这里也可以写成var show = function(){ }
document.write( i++ + “<br />” );
}
//然后我们写一个按钮，点击按钮启动定时器
window.onload = function(){
var obtn = document.getelementbyid( “btn” ); //先获取按钮
obtn.onclick = function(){ //把事件驱动函数绑定给这个按钮
setinterval( show,1000 ); //这里是函数的传参，传show，也可以将show改成function定义的函数内容
}
}
</script>
</head>
<body>
点击按钮时启动一个定时器，这个定时器让它执行show函数
<input type=”button” id=”btn” value=”按钮” />
</ body>
</html>
运行结果如下：
取消定时器
clearinterval();
参数：定时器的id
功能：取消定时器
我们把上面的小例子中的按钮id输出一下
window.onload = function(){
var obtn = document.getelementbyid( “btn” );
obtn.onclick = function(){
var timer = setinterval( function(){
document.write( i++ + “<br />” );
} ,1000 ); //改写的上面的函数传参
alert( timer );
}
}当我们点击按钮时运行的按钮id为
那么怎么去取消定时器呢？
我们需要加一个if判断条件，控制它什么时候取消
window.onload = function(){
var obtn = document.getelementbyid( “btn” );
obtn.onclick = function(){
var timer = setinterval( function(){
document.write( i++ + “<br />” );
if( i == 3 ){
clearinterval( timer );
}
} ,1000 ); //改写的上面的函数传参
alert( timer );
}
}运行结果如下
以上是定时器的使用及清除
标签间的所有内容
innerhtml
功能：标签间的所有内容
举个小例子：
如果我们的div中有一些信息，想要通过点击按钮来获取这个信息，就需要用到它
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>document</title>
<script type = "text/javascript">
window.onload=function( ){
var obtn=document.getelementbyid( “btn” );
var odiv=document.getelementbyid( “div1” );
obtn.onclick=function( ){
//获取div标签间的内容
alert(odiv.innerhtml);
}
}
</script>
</head>
<body>
<div id =”div1”><em>斜体</em></div>
<input type=”button” id = “btn” value=”按钮” />
</ body>
</html>
运行结果如下，当我们点击按钮时，就弹出对话框
获取时并不仅仅是文字获取，而是标签一起获取
如果我们想要设置innerhtml的内容，可以这样写
window.onload=function( ){
var obtn=document.getelementbyid( “btn” );
var odiv=document.getelementbyid( “div1” );
obtn.onclick=function( ){
//获取div标签间的内容
odiv.innerhtml=”<h1>我是替换文本</h1>”
}
}
运行结果点击按钮就可以看添加的
如果在innerhtml包含标签，标签会被识别，并且会解析，呈现对应的效果。
– 写作不易，大家多多关注，谢谢啦-
上一篇： python的缓存机制
下一篇： 【Vue】路由
推荐阅读
-
javascript计时器频率设置（js中计时器的用法）
-
详解JavaScript的计时器和按钮效果设置
-
js中设置元素class的三种方法小结_javascript技巧
-
JS中数组Array的用法示例介绍_javascript技巧
-
js中windows的函数(随机数，计时器的实现)
-
JS中setTimeout()的用法详解_javascript技巧
-
js中for in语句的用法讲解_javascript技巧
-
Js(JavaScript)中,弹出是或否的选择框示例(confirm用法的实例分析)_javascript技巧
-
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别_javascript技巧
-
JS中如何设置readOnly的值_javascript技巧