jQueryを使用してテキスト区切りイメージを置き換える

Question

登録商標記号「®」が多く使用されているサイトがあります。このシンボルは、周囲のテキストと同じサイズでレンダリングされます。小文字と上付き文字を表示する必要があるため、jQueryを使用してページ上の "®"のすべてのインスタンスを見つけ、 "<span class="reg-mark">®</span>"に置き換えます。このようにして、そのキャラクターの表示をスタイルすることができます。

私は、検索のために次のコードを使用して交換しています：

<script type="text/javascript" charset="utf-8"> 
    $(document).ready(function() { 
     var strNewString = $('body').html().replace(/®/g,'<span class=\"reg-mark\">®</span>'); 
     $('body').html(strNewString); 
    }); 
</script> 

私は彼らに私が望むようにスタイリングできるように、これは成功し、「®」のすべてのインスタンスを置き換えます。

しかし、タグの 'alt'属性の「®」のインスタンスも置き換えられ、画像の表示が中断されます。

属性値をスキップしてこの検索と置換を行う方法はありますか？

おかげで、 PJ

Answer 1

はjQueryのではないセレクタを使用してください。例えば、<img>タグに "not"を付けてください。 http://api.jquery.com/not-selector/

<script type="text/javascript" charset="utf-8"> 
    $(document).ready(function() { 
     var strNewString = $('body:not(img)').html().replace(/®/g,'<span class=\"reg-mark\">®</span>'); 
     $('body').html(strNewString); 
    }); 
</script> 

Answer 2

$('div, p, a, h1, h2, h3').filter(":contains('®')").each(function(){ 
    $(this).html($(this).html().replace('®', '<span class="reg-mark">®</span>')); 
}); 

DEMO

Answer 3

Iは、例えば、

鋭い括弧の間になるように®を必要とする正規表現のために行くだろう：/（>^<] ）® （[^ <] <）/

その後、新しいマッチにパート1、新しい挿入物とパート3を連結することができます。

ただし、これはHTMLブラケットの中間にあるものと一致します。任意の種類の属性のテキストを一致させたい場合、これは機能しません。

Answer 4

<script type="text/javascript" charset="utf-8"> 
    $(document).ready(function() { 
     var strNewString = $('body:not(img)').html().replace(/®/g,'<span class=\"reg-mark\">®</span>'); 
     $('body').html(strNewString); 
    }); 
</script> 

だと思います。それはBODY内のすべての "@"を見つけるはずですが、IMGタグをスキップします。 ALTタグに焦点を当てるセレクタもあります。例えば：

$('img[alt="@"]')