JavaScriptで4つの異なる*単語を検出してスタイリングを追加する

Question

これは私の最初の投稿ですが、私はこのサイトをリソースとしてかなり愛用しています。しかし、今質問が出てきました...

私はこの質問の調査中にたくさんのJavaScriptハイライトプラグインを見つけましたが、彼らはすべてという1つのという単語を見つけることに集中しています。私が作成しているファンサイト（Mega Man Battle Network、関心のある人のために）では、 "Fire"、 "Aqua"、 "Elec"、 "Wood"という単語を検出する方法を見つけたいと思います。それらにスタイリングを自動的に追加することができます。

私を助けるためにそこにJavaScriptの達人？

Answer 1

私はそれを理解しました。

$(document).ready(function(){ 
    $('div.elemental:contains("Aqua")').addClass('aqua'); 
    $('div.elemental:contains("Fire")').addClass('fire'); 
    $('div.elemental:contains("Wood")').addClass('wood'); 
    $('div.elemental:contains("Elec")').addClass('elec'); 
}); 

は今、私はちょうどハイライトは私がに行く新しいページごとに行われているように、新しい機能へのコールバックを作成する方法を把握する必要があります。

Answer 2

あなたが発見された単語気にしない場合、あなたはこのような正規表現を使用できます。実際に

/\bfire|aqua|elec|wood\b/gi 

を、今、私はそれについて考えることを、私はまだ同じ正規表現を（のみで使用したいですあなたが見つけた言葉に気をつけたとしても）。 javascriptとjqueryを使用して単語を含むセクションを選択し、その単語をクラス名として追加して、そのクラスに関連付けられているCSSを適用します。次のようになりregexで

：あなたが探していることでしょう

/\b(fire|aqua|elec|wood)\b/gi 

jQueryのは、おそらくフィルタ機能になります：http://api.jquery.com/filter/#expr

あなたがそれらのオブジェクトを持っていたら、あなたが使用してスタイルを適用することができますjQueryと.addClass：http://api.jquery.com/addClass/