常见的加载事件
<script>
// 第一种
window.onload = function () {
alert(‘111‘)
};
window.addEventListener(‘load‘, function () {
alert(‘222‘)
}); // 不影响
document.addEventListener(‘DOMContentLoaded‘, function() {
alert(33); // 不加载图片等
})
</script>
setTimeout() 定时器
开启定时器
<script>
function callback() {
console.log(‘111‘);
}
var tinner1 = setTimeout(callback, 2000);
var tinner2 = setTimeout(callback, 3000);
</script>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <img src="ad.jpg" alt="" class="ad"> <script> var img = document.querySelector(‘.ad‘); setTimeout(function () { img.style.display = ‘none‘; },2000) </script> </body> </html>
停止定时器
<button>关闭定时器</button>
<script>
var timer = setTimeout(function () {
console.log(‘111‘);
}, 1000);
var btn = document.querySelector(‘button‘);
btn.addEventListener(‘click‘, function () {
clearTimeout(timer)
})
</script>
setInterval() 定时器
开启定时器
停止定时器
<button>关闭定时器</button>
<script>
var timer = setInterval(function () {
console.log(111);
}, 1000);
var btn = document.querySelector(‘button‘);
btn.onclick = function () {
clearInterval(timer) // 关闭定时器
}
</script>
注意:
原文:https://www.cnblogs.com/py-web/p/12505453.html