ウェブページから特定の単語を含む特定のHTML要素を非表示にするにはどうすればよいですか？

Question

Facebookのニュースフィードから "foo"という単語を表示するHTML要素を非表示にしたいとします。

これまで、特定の単語の存在を検出し、投稿全体を隠すバックグラウンドで実行されるJavaScriptを使用して拡張機能を作成する必要があることを知りました。

基本的に、ブラウザで実行される広告ブロック拡張がどのように実装されているかを理解したいと思います。

Answer 1

あなたは、特定の要素を取得するには、この

使用querySelectorAllのように行うこともできますし、絶対的な要素をターゲットにIDやクラスのような、より具体的なセレクタを使用することができます。コレクション&を介してtextContentまたはinnerHTMLを確認してください。

あなたはそれが直接スタイルプロパティを変更非表示にしたり、非表示にするには、その要素にクラスを追加することができ、それ

var getAllDiv = document.querySelectorAll('div'); 
getAllDiv.forEach(function(item) { 

    if (item.textContent.trim() == 'John') { 
    console.log(item.textContent) 
    item.style.display = 'none' 
    } 

}) 

DEMO