<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>event对象的冒泡</title> </head> <style> #pm2 { width:250px; height:50px; border:2px dashed #CCC; padding:10px; text-align:center; line-height:40px; margin:0 auto; } #box2 { width:250px; height:70px; background:#000; text-align:center; margin:0 auto; padding:10px; padding-top:30px; } </style> <body> <p id="pm2"></p> <div id="box2"> <button id="btn2">点击</button> </div> <script> function stopPropagation(e){ e = window.event || e; if(document.all){ //document.all只支持IE属性 通过判断浏览器种类 e.cancelBubble = true; } else{ e.stopPropagation(); } } var _pm2 = document.getElementById("pm2"); var _box2 = document.getElementById("box2"); var _btn2 = document.getElementById("btn2"); _box2.onclick = function (){ _pm2.innerHTML = "你点击的是:DIV"; alert(1); } _btn2.onclick = function (e){ _pm2.innerHTML = "你点击的是：BUTTON"; alert(2); stopPropagation(e) } </script> </body> </html>