Question

理论上，如果我设置了run_at，那么在页面完全加载后，我用来选择页面上元素的.js就会触发。但事实并非如此。

在我的content.js中，我有

    "content_scripts": [
        {
          "js": ["extensions/jquery-2.2.2.min.js", "content.js"],
          "run_at": "document_idle"
        }
      ]

在我的content.js中，我只是：

alert("alert");
console.log("hello");
var fullname2 = $('#topcard').find('.profile-info').find('h1').text();
console.log(fullname2);

警报和第一个console.log都有效。第二个控制台日志没有记录任何内容，因为选择器无法选择任何内容。我知道这个，因为如果我为content.js代码块添加一个setTimeout，并等待2秒，第二个控制台日志会正确显示fullname2。

知道为什么content.js在页面完全加载之前显然会触发，这样选择器找不到任何东西？

Answer 1

run_at: "document_idle"保证脚本在DOMContentLoaded事件后执行，表示所有静态 DOM内容都已解析并可用。

如果某个元素尚未存在，这意味着它将在以后通过页面自己的代码动态添加。

显然，Chrome无法预测页面何时（如果有！）已完成＆＃34;已完成＆＃34;州。您需要设置自己的条件（例如＆＃34;出现#topcard时）。

话虽如此，您的策略应该如下：

检查元素是否已存在。如果是，请处理它并完成。
设置listener for changes in the document。这是通过MutationObserver完成的，为了简单起见，我强烈推荐使用mutation-summary library。

chrome扩展：尽管run_at：document_idle，js脚本也会过早触发

1 个答案: