Реинициализация содержимого скрипта после загрузки Ajax?

Question

В моем скрипте контента я прохожу весь DOM и делаю что-то для всех <img> элементы например.

я использую onUpdated в моем Background.js проверить, когда открыта вкладка, а затем выполнить скрипт.

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 где упоминается эта проблема.

Пытался:

• добавление all_frames : true в manifest ничего не делает.
• удаление условного info.status также ничего не делает.

Answer 1

Вам нужно будет следить за страницей для вставки новых изображений, например, используя MutationObserver или же mutation-summary библиотека. tabs события не будут срабатывать при таких изменениях страницы.

Смотрите этот вопрос для обсуждения способов сделать это.