此问题已在此处有答案:
Is there a JavaScript / jQuery DOM change listener?(5个答案)
5小时前关闭
我正在构建一个Chrome扩展,并希望注入DOM元素或修改一些。
为此,我尝试使用content.js
等待DOM加载元素,然后使用它。然而,我的目标DOM元素似乎是在Async/Await调用之后构建的。
Async/Await调用完成后如何访问DOM元素?
来自我的***content.js***:
window.document.onreadystatechange = function () {
console.log(window.document.readyState); /* "complete" */
if (window.document.readyState === "complete") {
console.log(window.document.getElementById('chips')); /* null */
}
}
我的目标URL是YouTube直播:https://www.youtube.com/watch?v=gxG3pdKvlIs&ab_channel=FRANCE24(例如)。在DevConsole中运行:window.document.getElementById('chips')
正确记录元素。
1条答案
按热度按时间ktecyv1j1#
您可以使用
MutationObserver
API来检测元素何时被添加到DOM,然后修改它。下面是一个示例,说明如何使用
MutationObserver
来检测ID为chips
的元素何时被添加到DOM中:这段代码创建了一个新的
MutationObserver
,并开始观察文档的变化。当检测到变化时,它会检查ID为chips
的元素是否已经添加到DOM中。如果已经添加,它会修改元素并断开观察者。您可以将此代码放在
content.js
文件中,等待元素添加到DOM中,然后修改它。