点击事件与定时器
-
点击事件
元素.onclick = function () {}
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <a href="http://www.baidu.com">按钮</a> <script> let oBtn = document.querySelector("a"); oBtn.onclick = function () { alert("nhw"); return false; //覆盖系统同名事件 } </script> </body> </html>
-
执行一次定时器
window.setTimeout(执行的函数,等待时间)
:返回一个ID,可以传到clearTimeout(ID)
中去清除定时器-
格式:
let id; let oBtn1 = document.querySelectorAll("button")[0]; oBtn1.onclick = function () { id = setTimeout(function () { console.log(123); }, 1000) } let oBtn2 = document.querySelectorAll("button")[1]; oBtn2.onclick = function () { clearTimeout(id); //清除定时器 }
-
重复执行定时器
window.setInterval(执行的函数,间隔时间)
:返回一个ID,可以传到clearInterval(ID)
中去清除定时器-
格式:
let id; let oBtn1 = document.querySelectorAll("button")[0]; oBtn1.onclick = function () { id = window.setInterval(function () { console.log(123); }, 1000) } let oBtn2 = document.querySelectorAll("button")[1]; oBtn2.onclick = function () { clearInterval(id); //清除定时器 }