javaScript的點選事件的寫法
阿新 • • 發佈:2018-12-19
1.使用DOM的事件方法
<!DOCTYPE html> <html> <head> <title>Javascript中點選事件方法一</title> </head> <body> <button id="btn">click</button> <script type="text/javascript"> var btn = document.getElementById("btn"); btn.onclick=function(){ alert("hello world"); } </script> </body> </html>
消除事件:btn.onclick=null;
2.使用DOM元素的方法addEventListener(event, function, useCapture)
event: 必須,即事件。 function: 必須,即自己寫方法(要操作的內容)。 useCapture: 可選。布林值,指定事件是否在捕獲(true)或冒泡(false)階段執行。 具體詳解可到 http://www.runoob.com/jsref/met-element-addeventlistener.html 瞭解
<!DOCTYPE html> <html> <head> <title>Javascript中點選事件方法二</title> </head> <body> <button id="btn">click</button> <script type="text/javascript"> var btn = document.getElementById("btn"); btn.addEventListener('click',function(){ alert("hello wrold"); },false) </script> </body> </html>
3.在標籤裡直接寫onclik
<!DOCTYPE html> <html> <head> <title>Javascript中點選事件方法三</title> <script type="text/javascript"> function test(){ alert("hello world"); } </script> </head> <body> <button id="btn" onclick="test()">click</button> </body> </html>