下麵這些客戶端 javascript代碼用到了事件,它給一個很重要的事件--“load" 事件註冊了一個事件處理程式。同時展示了註冊”click“事件處理函數更高級的一種方法 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset=
下麵這些客戶端 javascript代碼用到了事件,它給一個很重要的事件--“load" 事件註冊了一個事件處理程式。同時展示了註冊”click“事件處理函數更高級的一種方法
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 </head> 7 <body> 8 <script> 9 //dom2級事件語法是 addEvenLisetener("event","執行函數內容") 10 window.onload = function(){ //設置當頁面載入時執行 11 var btn =document.getElementsByTagName("button") //獲取btn元素 12 for( var i = 0;i<btn.length;i++){ //把每個button元素便利出來 13 var button = btn[i] 14 if(button.addEventListener){ //判斷游覽器的相容問題,如果是ie8以下的用的是else語用代碼段里的 15 button.addEventListener("click",change) 16 } 17 else{ 18 button.attachEvent("onclick",change) 19 } 20 21 } 22 } 23 function change(e){ //執行函數內容 24 e.target.style.color ="red" //著重解釋一下e.target什麼意思 ,e代表事件, target代表元素,合起來就是事件元素指的就是被監聽到的事件目標變樣式 25 e.target.style.background ="black" 26 } 27 </script> 28 <button>按鈕一</button> 29 <button>按鈕二</button> 30 <button>按鈕三</button> 31 <button>按鈕四</button> 32 <button>按鈕五</button> 33 </body> 34 </html>