阻止事件冒泡和默认事件(Vue与JavaScript对比)

事件流

• 事件流: 事件在元素之间的传播过程.

• 事件捕获阶段: 从window对象到具体对象的过程.

• 目标确定阶段: 确定具体的目标

• 事件冒泡阶段: 从具体目标到window的过程.

• 使用addEventListener来监听事件流, addEventListener有三个参数, 其中第三个参数为Boolean(是否捕获), true表示捕获阶段, false表示冒泡阶段.

• JavaScript中事件默认是冒泡的, 默认冒泡到window, 低版本IE只到document.

1.js阻止事件冒泡和默认事件

        阻止事件冒泡: event.stopPropagation ? event.stopPropagation() : event.cancalBubble = true;

 

 

        阻止默认事件:

        DOM0级事件: return false;

DOM1级事件:event.preventDefault ? event.preventDefault() : event.returnValue = false;

 

 

2.Vue阻止事件冒泡和默认事件

        

• .stop：阻止事件冒泡

• .prevent：阻止默认行为

 

总结: Vue并不需要兼容低版本浏览器,而JS需要兼容低版本浏览器