Heim > Artikel > Web-Frontend > Es gibt verschiedene Möglichkeiten, Ereignisse zu Elementen in Javascript hinzuzufügen
Javascript bietet drei Möglichkeiten, Ereignisse zu Elementen hinzuzufügen: 1. Bindung direkt im HTML-Tag; 2. Bindung nach Erhalt des entsprechenden Dom-Elements in js; 3. Verwendung von addEventListener in js, um die Bindung zu implementieren.
Die Betriebsumgebung dieses Tutorials: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.
1. Binden Sie das entsprechende dom-Element in js ein.
3. Verwenden Sie addEventListener(), um die Bindung zu implementieren :
<!-- 以下为给dom元素绑定js事件的三种方法 --> <!-- 1--html内直接绑定 --> <input type="button" id="btn0" onclick="alert('执行了html绑定的方法')" value="html中绑定"></input> <!-- 2--使用js绑定 --> <input type="button" id="btn1" value="js绑定"> <!-- 3--使用addEventListener绑定 --> <input type="button" id="btn2" value="addEventListener绑定"></input> <script> //********js绑定事件的js代码********* let button1 = document.getElementById("btn1") button1.onclick = function() { console.log("执行了js绑定的事件") } //将覆盖之前绑定的onclick事件 button1.onclick = function() { console.log("执行了js绑定的第二个事件") } //*********addEventListener绑定的js代码********* let button2 = document.getElementById("btn2") //使用addEventListener()可为一个元素绑定多个事件 button2.addEventListener("mouseover", func1, false) button2.addEventListener("click", func2, false) button2.addEventListener("click", func3, false) function func1() { console.log(button2) } function func2() { console.log(Date()) } function func3() { console.log("---------------") } //使用removeEventListener(event,function)移除事件 // button2.removeEventListener("mouseover", func1) </script>
【Empfohlenes Lernen:
Javascript-Tutorial für Fortgeschrittene】
Das obige ist der detaillierte Inhalt vonEs gibt verschiedene Möglichkeiten, Ereignisse zu Elementen in Javascript hinzuzufügen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!