javascript等待使用chrome扩展在网站上加载元素

ibrsph3r  于 2021-09-23  发布在  Java
关注(0)|答案(4)|浏览(359)

我正在开发一个chrome扩展,它可以点击网站上的元素,但其中一些元素会在稍后出现,并且代码不起作用,因此我需要让函数等待所选元素加载。
而不是像on那样在几秒钟内延迟等待 setTimeout 功能。
我怎么做?

uujelgoq

uujelgoq1#

可以使用mutationobserver执行以下操作:

function handleSomeDiv(someDiv) { 
    console.log("div was handled");
}

const observer = new MutationObserver(function (mutations, mutationInstance) {
    const someDiv = document.getElementById('some-div');
    if (someDiv) {
        handleSomeDiv(someDiv);
        mutationInstance.disconnect();
    }
});

observer.observe(document, {
    childList: true,
    subtree:   true
});
axr492tv

axr492tv2#

let element = document.getElementById('elementId')
while (element === null) {
    console.log('Waiting for element')
    element = document.getElementById('elementId')
}

// Perform operation with element
jm81lzqq

jm81lzqq3#

有两种方法可以做到这一点:

window.onload:

html:

<p id="pElement">Hello</p>

javascript:

window.onload = () => {
  document.getElementById("pElement").innerHTML+=", world!"
}

document.addeventlistener(“加载”)

html:

<p id="pElement">Hello</p>

javascript:

document.addEventListener('load',()=>{
  document.getElementById("pElement").innerHTML += ", world!";
});;
a5g8bdjr

a5g8bdjr4#

你可以试试 setInterval 此方法将一直在页面中工作,当您的条件为真时,它将执行此方法,但使用时要小心-因为此方法将一直在页面中工作,所以您需要添加条件以仅执行一次
例子

var check = false;
setInterval(function () {
   if(document.getElementById("id") !== null && check === false) {
        document.getElementById("id").click();
        check = true;
    }
}, 1000)

这将是每秒钟检查一次,当您的条件为真时,它将只执行一次
如果您删除了检查条件,它将每秒执行此代码

相关问题