如何将新函数绑定到元素的onclick事件，并使其在所有其他绑定函数之前运行

Question

我们希望使用浏览器扩展程序为现有页面添加功能。假设一个元素已经具有绑定到其onclick事件的函数。我正在将一个新函数绑定到该元素的onclick上。我想让我的函数在之前绑定到该事件的所有其他函数之前运行。我不希望它们在我的函数运行完毕之前开始执行。

我想知道如何在JavaScript中以这种方式绑定我的新函数。

Answer 1

你不能真的。事件侦听器通常按照它们附加到元素的顺序执行，并且can't get those already added。如果您的插件在任何其他侦听器添加代码之前不会执行，那么您唯一的机会就是尽可能早地进入事件调度过程。

我能想到的最好的方法是add a listener在{dom的最高点capture phase：

document.documentElement.addEventListener("click", function(e) {
    if (e.target == theElementInQuestion) // or check for e.target.id...
        // do something with the event like
        e.stopImmediatePropagation();
}, true /* sic! */);