无法操作通过chrome.tabs创建的新选项卡的DOM

Cannot Manipulate DOM of new tab created via chrome.tabs

本文关键字：新选项 DOM 选项 创建 操作 tabs chrome      更新时间：2023-09-26

以下是我所做的：

chrome.tabs.create({url:msg.url}, function(tab) {
    chrome.tabs.executeScript(tab.id, {
        runAt:"document_end", 
        allFrames:true,
        code:"var ready = function(fn){ if(typeof fn!== 'function') return ; if(document.readyState === 'complete') {return fn();}  if(document.readyState === 'interactive'){ return fun(); };}; ready(function() { console.log(document.querySelector('#rso h3 a')) alert('yes'); document.querySelector('#rso h3 a').click(); });"
    });
});

但js似乎是在孤立的环境中运行的，所以我无法操作DOM，有什么解决办法吗？

我还尝试了code属性只包含以下片段

document.querySelector('#rso h3 a').click();

PS：如果code属性是，例如对alert()函数的调用，那么它会完美地工作。

感谢@Xan和我们对该主题的讨论，通过使用具有code属性的setInterval和clearInterval的组合解决了问题，如下所示：

code: "var intrvl = null; function fn(){ var a = document.querySelector('#rso h3 a'); if(a !== null){ clearInterval(intrvl); a.click(); } }; intrvl = setInterval(fn, 500);"

问题是，我试图注入这个javascript的特定页面已经创建了我想要动态操作的元素，而document_end只能保证加载所有静态DOM，我必须采取这种解决方法。

另一种方法可以是在Javascript或原始MutationObserver API中使用突变库。

相关文章：