在上面的例子中,点击p元素里面的内容,显然会触发p元素的事件处理程序clickChild。然后,因为p元素是放在div里面的,点击p元素相当于点击了div元素,会触发div的事件处理程序clickParent,这个过程被称为事件冒泡。
事件冒泡不是所有的时候都受到欢迎,有的时候需要控制它的发生,使用event.stopPropagation()即可。
function clickChild() {
console.log("子");
window.event?window.event.cancelBubble=true:event.stopPropagation();
}