事件委托技术
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 5 <title>test01</title> 6 </head> 7 <body> 8 <ul id="myLinks"> 9 <li id="goSomewhere">Go somewhere</li> 10 <li id="doSomething">Do something</li> 11 <li id="sayHi">Say hi</li> 12 </ul> 13 <script type="text/javascript" src="test01.js"></script> 14 </body> 15 </html>
1 var list = document.getElementById("myLinks"); 2 3 EventUtil.addHandler(list, "click", function(event) { 4 event = EventUtil.getEvent(event); 5 var target = EventUtil.getTarget(event); 6 7 switch (target.id) { 8 case "doSomething": 9 document.title = "I changed the document's title"; 10 break; 11 12 case "goSomewhere": 13 location.href = "http://www.google.com/"; 14 break; 15 16 case "sayHi": 17 console.log("hi"); 18 break; 19 } 20 });