在 Ajax 加载后重新初始化内容脚本

Reinitialising content script after Ajax load?

本文关键字：初始化 脚本 Ajax 加载      更新时间：2023-09-26

在我的内容脚本中，我正在遍历整个 DOM，例如对所有<img>元素执行一些操作。

我在Background.js中使用onUpdated来检查何时打开选项卡，然后执行脚本。

chrome.tabs.onUpdated.addListener(function(tabId, info, tab) { 
        chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
            if(info.status == "complete") {
                chrome.tabs.sendMessage(tabs[0].id, function (response) {
                   // send data to content script etc.
                });
            }
        });
}

这适用于未动态加载的内容 - 例如，在Facebook新闻提要上，它将对所有最初可见的图像执行我想要的操作 - 但是当我向下滚动时，会加载新的故事/照片等（使用AJAX？ 不确定），当然这些<img>元素不受我的内容脚本的影响。

如何重新加载（或调整会更好，因为我必须搜索整个 DOM 并且速度很慢）我的内容脚本，以便它适用于这个新调整的 DOM？我在这里找不到任何选项卡方法 - https://developer.chrome.com/extensions/tabs 提到这个问题。

试：

  • 在manifest中添加all_frames : true没有任何作用。
  • 删除 info.status 条件也不执行任何操作。
您需要

监视页面以插入新图像，例如使用MutationObserver或mutation-summary库。 tabs事件不会在此类页面更改时触发。

有关执行此操作的方法的讨论，请参阅此问题。

相关文章：