如何在 javascript 上打破 event.stopImmediatePropagation

Question

在构建扩展程序时，网页禁用了所有 eventListeners 并在我的测试扩展程序上禁用了 eventListeners。例如，当事件监听器看起来像，

element.addEventListener('click', (e) => {
 e.stopImmediatePropagation();
 console.log('A click event fired.');
});

但是网页禁用了事件监听器（我无法编辑网页）。正如我所期望的 Event.stopImmediatePropagation() 在所有事件侦听器上触发并阻止事件侦听器触发事件。喜欢，

let element = document.querySelector('#test');
// From the webpage,
element.addEventListener('click', (e) => {
e.stopImmediatePropagation();
console.log('A click event fired.');
});

// From my test extension, 
//this event listener is stopped by e.stopImmediatePropagation();
element.addEventListener('click', (e) => {
console.log('Extension is executed.');
});

<div id='test'>
Click me
</div>

我发现了一个关于 how to break event.stopImmediatePropagation 的问题。但是只有 jQuery.

的解决方案

我想知道如何仅使用 javascript 来打破 stopimmediatepropagation。如有任何评论或回答，我们将不胜感激。

Answer 1

如果这真的是针对点击事件（或至少是冒泡事件），您可以在任何脚本运行之前在文档上添加捕获事件处理程序。这将确保您收到活动。

let element = document.querySelector('#test');
// From the webpage,
element.addEventListener('click', (e) => {
e.stopImmediatePropagation();
console.log('A click event fired.');
});

// From your test extension, 
// make it run before the page's scripts
// to be sure to also catch other "captured" events
document.addEventListener('click', (e) => {
 if( e.composedPath().includes( element ) ) { // check that 'element' has really been clicked
    console.log('Extension is executed.');
 }
}, { capture: true }); // catch it in capture phase

<div id='test'>
Click me
</div>

如何在 javascript 上打破 event.stopImmediatePropagation

how to break event.stopImmediatePropagation on javascript

html

javascript

events

addeventlistener

google-chrome-extension