1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>this和event.target的区别</title> 6 <script type="text/javascript" src="jquery.min.js" ></script> 7 </head> 8 <body> 9 <script type="text/javascript"> 10 $(function(){ 11 $("li").click(function(e){ 12 alert("下面是li的"); 13 alert($(this).html()); 14 alert($(e.target).html()); 15 }); 16 $("ul").click(function(e){ 17 alert("下面是ul的"); 18 alert($(this).html()); 19 alert($(e.target).html());//最原始触发事件冒泡的位置的 20 }); 21 22 }) 23 // 1.this和event.target的区别： 24 // 25 // js中事件是会冒泡的，所以this是可以变化的，但event.target不会变化，它永远是直接接受事件的目标DOM元素； 26 // 27 // 2.this和event.target都是dom对象，如果要使用jquey中的方法可以将他们转换为jquery对象：$(this)和$(event.target); 28 </script> 29 <div> 30 <ul> 31 <li>你好</li> 32 </ul> 33 </div> 34 </body> 35 </html>