2011-02-08 24 views
3

I持って、次のHTML子要素を選択することなく、第1レベルのテキスト要素を「の.text()」を選択

<label> 
outer 
<span>inner</span> 
</label> 

私はその 『内部』でスパンを残し、 『外』の値を交換したいですテキストはそのままです。使用方法

$('label').text('new outer'); 

は、ラベルの内容全体(スパンとともに)を置き換えます。余分なスパンを追加したり、ラベルの内側スパンの値を保存してから再度適用したりするなどの高度な作業をせずに、テキストブロック「外側」を選択するだけの気の利いた方法はありますか?

答えて

1

余分なスパンを追加したり、ラベルの内側スパンの値を保存してから再適用したりすることなく、テキストブロック 'outer'のみを選択するという気の利いた方法はありますか?

実際はありません。

あなた<span>前に、すべてを置き換えるために、正規表現を使用することができますが、それは不格好正規表現となり、それはいくつかのケースのために働くだろうが、あなたがそこに他のマークアップを持っていた場合、それは、破る特にあなたの場合<span>をラップする別の要素がありました。

私の提案は、そこに別のスパンを入れることです。あなたがそのコードブロックを操作しようとしていることが分かっているなら、それにDOMの要素を与えます。これは簡単に入手できる最良の方法です。単一の単語を変更したかったからといって、構造全体を再構築するなど、愚かな作業をしなくて済むようにします。

+0

ありがとうございます - これは私がやったことです。 –

6

これはspan(又は任意の後続Textノード)を乱すことなく、要素の最初Text nodeのテキストだけを更新します:

$("label").contents().each(function() { 
    // Within this iterator function, jQuery sets `this` to be 
    // each child node (including Text nodes, not just Elements) 
    if (this.nodeType === 3) { // 3 = text node 
     this.nodeValue = "updated "; 
     return false; 
    } 
}); 

Live exampleを| source

もちろん、それを洗練することができます。 Textノードの現在のテキストはnode.nodeValueから(もちろん)利用できるので、それを変更したい場合(おそらくそれの特定の部分だけを置き換える場合)、それを行うことができます。または与えられたパターンに一致する最初のものを修正したい場合など

+0

私は答えが好きです。たとえそうしないと決めたとしても、 –

+1

この回答をいただきありがとうございます。テキストと子要素を含むラベルがある場合は本当に役に立ちました。 jQuery text()メソッドはすべてを置き換えていました。 –