1、其他函数
obj = setInterval(‘函数名称‘, 毫秒数); clearInterval(obj); --->这就相当于一个定时器；
obj = setTimeout(‘函数名称‘, 毫秒数); clearTimeout(obj);
2、滚动条
!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>页面一</title>
</head>
<body>
<hr/>
<div style = ‘width:500px;background-color:#ddd‘>
<div id = ‘process‘ style = ‘width:10%;height:10px;background-color:green;‘></div>
</div>
<script type = ‘text/javascript‘>
/* window.prb = 10;
function Foo(){
var id = document.getElementById(‘process‘);
window.prb += 10;
if(window.prb > 100){
clearInterval(window.interval);
}else{
id.style.width = window.prb + ‘%‘;
}
}
window.interval = setInterval(‘Foo()‘, 500); //设置定时器
*/
window.prb = 10;
function Foo(){
var id = document.getElementById(‘process‘);
window.prb += 10;
if(window.prb > 100){
clearTimeout(window.interval);
}else{
id.style.width = window.prb + ‘%‘;
}
}
window.interval = setTimeout(‘Foo()‘, 500);
</script>
</body>
</html>
运行结果
3、跑马灯
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>欢迎上级领导来校视察 </title>
</head>
<body>
<input type = ‘button‘ value = ‘关掉‘ onclick = ‘stop();‘/>
<script type = ‘text/javascript‘>
function Go(){
var content = document.title; //DOM获得标签的内容
var firstChar = content.charAt(0);
var sub = content.substring(1, content.length);
document.title = sub + firstChar;
}
interval = setInterval(‘Go()‘, 200);
function stop(){
clearTimeout(interval); //停止当前的程序运行。
}
</script>
</body>
</html>
运行结果
4、总结
(1)、num = setInterval(‘事件函数‘， 毫秒)，这个函数(setInterval)就是一个定时器，每隔多长时间执行一次这个函数；
clearInterval(num)，就是终止执行定时器函数；
(2)、num = setTimeout(‘事件函数‘， 毫秒)，这个函数只执行一次，就不在执行；
clearTimeout(num)，终止定时器的执行；
时间： 2024-11-05 20:40:58