2

現在、私は Jquery 文字列を使用して、サイトの本文全体で特定の単語をターゲットにして、それにクラスを追加しようとしています。したがって、たとえば「Nike」という単語が表示されるたびに、それが赤になり、末尾に TM が付けられます。

私はこれを使用していますが、コンテンツ内で最初に出現した Nike の作品を置き換えるだけで、すべてを置き換えない理由がわかりません。

サンプルは次のとおりです。http://jsbin.com/ijufu3/21/

何か案は？

4

2 に答える 2

2

これを試して/Nike/g

.replaceは最初の出現に対してのみ実行します..検索を続行するには、グローバル検索を実行する必要があります..

$('p:contains(Nike)').each(function(){
  $(this).html(
    $(this).html().replace(/Nike/g,'<span class="fancy">Nike</span>')
  );
});

</p>

于 2012-10-29T19:10:07.670 に答える
1

次のようなものを提案します。

$('body').html(
    function(i,h){
        return h.replace(/(Nike)/g,'<span class="nike tm">$1</span>');
    });​

次の CSS と組み合わせる:

.tm::after {
    content: '™';
}

.nike {
    color: red;
}​

JS フィドルのデモ。

セレクターは、単語を見つけると予想される要素に修正されます。

::after疑似要素/CSS 生成コンテンツを実装していないブラウザーをターゲットにする必要がある場合は、次のオプションもあります。

$('body').html(
    function(i,h){
        return h.replace(/(Nike)/g,'<span class="nike">$1™&lt;/span>');
    });​

JS フィドルのデモ。

クラスの追加を省略し、tm返された HTML 文字列にその文字を明示的に追加します。

これらのアプローチが機能するのは、正規表現がg('global' だと思いますか?) フラグを使用できるためです。フラグは、遭遇した一致 (括弧内の文字列) のすべての出現を置き換えます。ただし、コンテンツを見ているため、これにはhtmlのクラス名自体も置き換えられるというリスクがあります。そのため、この文字列が予期しない場所 (置換によって問題が発生する場所) でクロップされないように十分に注意してください。 ）。nike

于 2012-10-29T19:07:38.283 に答える