<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JavaScript - 事件代理</title> <mce:script type="text/javascript"><!-- window.onload = function() { var resources = document.getElementById('nav'); resources.onclick = handler; //添加监听函数 function handler(e) { var oEvent = window.event || e; //获取事件对象 var x = oEvent.srcElement || oEvent.target; //获取引起事件的元素/对象 if (x.nodeName.toLowerCase() == 'a') { alert(x.innerHTML); } } } // --></mce:script> </head> <body> <ul id="nav"> <li><a href="#" mce_href="#">首页</a></li> <li><a href="#" mce_href="#">产品介绍</a></li> <li><a href="#" mce_href="#">服务介绍</a></li> <li><a href="#" mce_href="#">技术支持</a></li> <li><a href="#" mce_href="#">立刻购买</a></li> <li><a href="#" mce_href="#">联系我们</a></li> </ul> <p>用事件代理监听一系列元素,无需遍历</p> </body> </html>