Расширение Chrome-script-script javascript - run_at document_end не работает правильно

Question

В качестве теста я создаю расширение chrome, которое скрывает раздел «новости» справа от facebook и рекламы на правой стороне. Также измените цвет фона на черный.

Моя проблема прямо сейчас заключается в том, что когда вы загружаете facebook, новости и белый фон отображаются на крошечную секунду, а затем исчезают. Кажется, что установка run_at на document_end делает мой javascript запустившимся после того, как страница уже загружена. Я пробовал document_start и document_idle тоже с аналогичными результатами. Как я могу сделать это так, чтобы раздел новостей вообще не отображался?

manifest.json:

{ 
    "manifest_version": 2, 

    "name": "FB_Trending_Hide_ChromeExtension", 
    "description": "This extension will hide the trending news section of Facebook", 
    "version": "1.0", 

    "browser_action": { 
    "default_icon": "icon.png" 
    }, 
    "content_scripts": [{ 
    "run_at": "document_end", 
    "matches": ["*://*.facebook.com/*"], 
    "js": ["content.js"], 
    "all_frames": true 
    }], 
    "permissions": [ 
    "tabs", "*://*.facebook.com/*", "activeTab" 
    ] 
} 

content.js:

document.getElementById("pagelet_trending_tags_and_topics").style.display = 'none'; 
document.getElementById("pagelet_ego_pane").style.display = 'none'; 
document.body.style.background = 'black'; 

Answer 1

Это похоже на работу для CSS, "css", content_scripts входа, а не JavaScript, "js". Использование CSS должно быть проще: вам не нужно даже учитывать, что элементы могут быть добавлены на страницу динамически.

Вы могли бы сделать что-то вроде:

manifest.json (content_scripts части только):

"content_scripts": [{ 
    "run_at": "document_start", 
    "matches": ["*://*.facebook.com/*"], 
    "css": ["facebookContent.css"], 
    "all_frames": true 
    }], 

facebookContent.css:

#pagelet_trending_tags_and_topics { 
    display:none !important; 
} 
#pagelet_ego_pane { 
    display:none !important; 
} 
body { 
    backgound:black !important; 
}