Блокировать div/элемент на веб-странице (разработка расширения Chrome) ⇐ CSS

[Anonymous]

Я учусь создавать расширение Chrome, которое блокирует элементы на веб-сайте социальной сети, такие как ленты, комментарии и т. д.
Например, я хочу заблокировать ленту Reddit, есть флажок для переключения, чтобы скрыть или отобразить корм. Этот флажок отправляет сообщение сценарию содержимого. Здесь я использую var toggle_reddit_feed = document.querySelector("shreddit-feed"), чтобы получить канал. затем скрываемся с помощью toggle_reddit_feed.style.display = 'none' . Это работает, когда я впервые загружаю страницу, однако, если я перейду на другую страницу в Reddit, скажем, на популярный канал, канал не скроется. Только после того, как я обновлю канал, он станет скрытым.
Поэтому изначально в моем сценарии содержимого я делал следующее, чтобы загрузить сценарий в DOM:

Код: Выделить всё

if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', loadScript());
console.log("DOM reloading");
} else {
console.log("DOM loaded");

loadScript();
}

Но потом, покопавшись, я прочитал, что можно использовать MutationObserver()

Код: Выделить всё

const redditMain = document.body;
const config = {  attributes: true, childList: true };

var callback = function(mutationsList, observer) {
for (var mutation of mutationsList) {
if (mutation.type === "childList") {
console.log("DOM updated");
loadScript();
}
}
};

const observer = new MutationObserver(callback);
observer.observe(redditMain, config);

В обоих случаях мне не удалось скрыть страницу.
Я также проверял документацию по расширению Chrome. В одном из примеров для начинающих, подобных этому, я видел ту же проблему.
Я знаю, что эти расширения/инструменты уже существуют, но я хочу узнать о разработке расширений JavaScript и Chrome.

Подробнее здесь: https://stackoverflow.com/questions/787 ... evelopment