作业1:多数值转换为数组
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>多值数据转换为数组</title>
</head>
<body>
<ul>
<li>ys1</li>
<li>ys2</li>
<li>ys3</li>
<li>ys4</li>
<li>ys5</li>
</ul>
<script>
var lis=document.getElementsByTagName('li');
var arr=Array.prototype.slice.call(lis,0);
console.log(arr);
</script>
</body>
</html>点击 "运行实例" 按钮查看在线实例
2,定时器:
定时器定义:让程序每隔一段时间间隔反复执行一项任务;
定时器分类:一次性定时器和周期性定时器
主要应用场景:
一次性定时器常常用于程序跳转,譬如登陆,延迟加载等
周期性定时器譬如轮播图,定期刷新表单,广告虚拟点击。
小计(来源网络):
定时器的定义:
让程序每隔一段时间间隔反复执行一项任务
定时器分为:周期性定时器和一次性定时器
周期性定时器:
让程序每隔一段时间反复执行一项任务
如何操作:
1、任务函数
function task(){...}
2、启动定时器
var timer = setInterval(task,ms) 1000ms = 1s
timer:定时器在内存中的序号:从1开始的整数
只要定时器可能被停止,都要在启动事先保存序号
3、停止定时器
clearInterval(timer)
停止定时器不会自动清空timer中的序号
如何解决:
建议停止定时器后,手动清空timer
timer = null
2种停止方式:
1、用户手动停止
2、自动停止
在任务函数内反复判断临界值
只要达到临界值,就自动停止
一次性定时器:
让程序先等待一段时间,再执行一次任务,执行后自动停止
如何操作:
1、任务函数task
2、启动定时器
var timer = setTimeout(task,ms)
3、停止定时器
clearTimeout(timer)
一般用于在执行任务之前,取消等待,不再执行
定时器作业
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>定时器与广告模拟点击</title>
</head>
<body>
<button>开始</button>
<button>停止</button>
<div style="width: 200px;height: 200px;background: aqua">联盟广告</div>
<p id="res"></p>
<script>
// var bt1 = document.getElementsByTagName('button').item(0);
// var bt2 = document.getElementsByTagName('button').item(1);
// var tips =document.getElementsByTagName('p').item(0);
// var timer = null;
// bt1.addEventListener('click',login,false);
// function login() {
// tips.innerText='正在跳转中....';
// timer=setTimeout(function () {location.assign('http://www.baidu.com');
//
// },3000);
// }
var div=document.getElementsByTagName('div').item(0);
var res=document.getElementById('res');
var num=0;
var price=0.5;
var click= new Event('click');
setInterval(function () {
div.dispatchEvent(click);
num=num+1;
res.innerHTML='广告收入'+(price*num)+'元';
},3000);
</script>
</body>
</html>点击 "运行实例" 按钮查看在线实例
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号