jQueryの1クラスで、すべてのdiv要素の内部スペースでドットを置き換える

Question

私は、最新のjQueryと次のスクリプトを使用しています：

<script type="text/javascript"> 
$(document).ready(function(){ 
var el = $('.title'); 
el.html(el.html().replace(/\./gi, " ")); 
}); 
</script> 

これはdiv要素である：

それは、すべて置き換え何

<div class="title">The.quick.brown.fox</div> 

クラス "タイトル"を持つDIVにスペースを入れたドットがあり、実際にはこの仕事でうまくいきます。

しかし、私はそれらの中に異なる文字列を持つ同じ "タイトル"クラスを持つ多くのDIVを持っています、そして、私はドットをスペースで置き換えるためにそれらをすべて必要とします。しかし、ここで問題は、すべてのソース文字列が異なるので、すべての結果文字列が異なっている必要がありますが、これらのDIVすべてで同じ結果の文字列である "クイックブラウンキツネ"と同じ問題が表示されます...

私は何をしますかクラス "タイトル"と各DIVのすべての異なる文字列を持つすべてのDIVで点を置き換えますか？

おかげ

Answer 1

あなたはマッチした要素を反復処理するためにeach()を使用するか、またはhtml()に関数を渡すと計算することができます新しいテキストがあります：

$(document).ready(function() { 
    $(".title").html(function(index, currentHtml) { 
     return currentHtml.replace(/\./gi, " "); 
    }); 
}); 

Answer 2

ただ、クラス.titleを持つすべての要素を反復処理するためのjQuery eachメソッドを使用します。

$(document).ready(function(){ 
    $('.title').each(function(){ 
    $(this).html($(this).html().replace(/\./gi, " ")); 
    }); 
}); 

Answer 3

divs、提案された関数は正常に動作します。しかし、任意のhtml（The.quick.brown <img src='fox.jpg'>のような）を許可するには、コードがより正確でなければなりません。

$('.title').each(function() { 
    if (this.nodeType == 3) 
     this.nodeValue = this.nodeValue.replace(/\./g, " "); 
    else 
     $(this).contents().each(arguments.callee); 
}); 

基本的には、ノードのすべての子孫を繰り返し反復し、タイプ3（=テキスト）のノードのみを置き換えます。

フィドル：http://jsfiddle.net/jZgUY/