事件的冒泡是自下而上的触发事件，例如
<script>window.onload = function(){var li = document.getElementsByTagName("li");var ul = document.getElementsByTagName("ul")[0];document.body.onclick = function(){alert("body被点击了")}ul.onclick = function(){alert("ul被点击了")}for(var i = 0;i<=li.length;i++){li[i].onclick = function (){alert("li被点击了")}}}</script><body><h2>hello</h2><ul><li>1234</li><li>abcd</li><li>ABCD</li></ul>
</body>当我们点击li时，窗口不仅仅只弹出li被点击了的提示框，而是依次弹出li被点击了，ul被点击了，body被点击了，
但是我们仅仅只想让他弹出一个li被点击了，该怎么办？
只用添加一行属性：event.cancelBubble = true;
<script>window.onload = function(){var li = document.getElementsByTagName("li");var ul = document.getElementsByTagName("ul")[0];document.body.onclick = function(){alert("body被点击了")}ul.onclick = function(){alert("ul被点击了")}for(var i = 0;i<=li.length;i++){li[i].onclick = function (){alert("li被点击了");event.cancelBubble = true;}}}</script>这样，就能达到我们需要的效果了。