<html> <meta charset="utf-8"> <head> <title>事件冒泡</title> <style> /*当下层元素和上层元素支持统一事件，当上层事件触发时，下层事件也触发，这就叫事件冒泡*/ /*取消事件冒泡：ev.cancelBubble = true*/ body{ background: red; } div{ 300px; height: 200px; background: green; } </style> </head> <body onclick="bottomLevel();"> <div onclick="topLevel();"></div> </body> <script > function bottomLevel() { alert('来自底层的呼声') } function topLevel(e) { //获取事件 var ev=e||event //取消事件冒泡，，其实就是阻止事件继续向下传递 ev.cancelBubble=true alert('地主家也没余粮') } </script> </html>