gpt4 book ai didi

JavaScript - 监听节点更改之前的情况

转载 作者:行者123 更新时间:2023-11-27 23:33:02 28 4
gpt4 key购买 nike

使用 MutationObserver,我监听树​​中的节点插入,但它在插入节点后运行。

如果我想在节点插入节点之前运行一个事件,我会做什么?

例如。

// create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log(mutation.type);
});
});

// configuration of the observer:
var config = { subtree: true };

// pass in the target node, as well as the observer options
observer.observe(document.documentElement, config);

该事件类似于 DOMNodeInserted 但如果我想要类似“BeforeDOMNodeInserted”的内容?

就像“beforescriptexecte”Firefox 监听器。

最佳答案

If i want to run a event before the node is inserted to the node what would i do?

标准 DOM API 不提供在“内容插入/更改之前”设置 Hook 的选项。

它必须是一个钩子(Hook)(函数),但不是一个事件。当您收到该事件(即异步)时,为时已晚 - 突变已经发生。

作为您的一个选项:为您的代码的其余部分定义一组 DOM 突变函数。在这些函数中,您可以在内容进入 DOM 之前对其进行“预过滤”。

更新,这是 Node.appendNode“劫持”的示例:

<html>
<head>

<script type="text/javascript">
!function(){
var pAppendChild = Node.prototype.appendChild;
Node.prototype.appendChild = function(child) {
console.log("got appendChild call!");
pAppendChild.call(this,child);
}
}();
</script>
</head>
<body>
</body>
<script type="text/javascript">
var p = document.createElement("p");
document.body.appendChild(p);
</script>
</html>

如果您运行代码,您将看到“gotappendChildcall!”在控制台中。

从概念上讲,您可以执行类似的操作并重新定义标准 DOM 突变方法。这有多实用是另一个故事了。

关于JavaScript - 监听节点更改之前的情况,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34383843/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com