0

私はdivこのようなテキストで構成されている可能性のあるsを持っています：

<div>
<p>
<span>My text <br /> Some more text</span>
</p>
</div>

またはこのように

<div>
<p> Here's a chunk of text </p>
</div>

または他の任意の組み合わせですが、最終レベルには、で区切られている場合とされていない場合があるテキストが含まれ<br />ます。（これには単一のノードspanが含まれていbrますか？それとも同じレベルの2人の兄弟ですか？）

最初のケースでは、私が欲しい最も深い子供たちからのテキストは次のとおりです。

My text
Some more text

第二に：

Here's a chunk of text

私のポイントは、最も深いレベルが何であれ、そのレベルのすべての兄弟が欲しいということです。何か助けはありますか？

編集

テキストのみが返されるため、単純に使用することはできません。テキストを編集してから、スタイルを保持したまま同じ兄弟$('p').text()に戻す必要があります。だから例えば私が持っているなら

<div>
<p>
<strong>
<span style='font-family:arial'> Here's some <br /> text</span>
</strong>
</p>
</div>

そして、私は$('p').text()「ここにいくつかのテキストがあります」を取得します。さて、このテキストを変数で操作するとき、たとえばchangedText（その<br />中に保持された状態で）、どうすれば元の場所に戻すことができますか？単純にできない

$('p').text(changedText);どちらもできません$('p').html(changedText');

<strong>と<span>フォーマットが失われるためです。divそのため、たとえば、で最も深いレベルのテキストノードを選択して、すべてのテキストにアクセスしたかったの$textNodesです。$textNodes.text(changedText);これにより、テキストノードの親の構造とスタイルを維持しながら簡単に実行できます。

それは可能ですか？

4

3 に答える 3

1

.children()最深部のノードまで使用できます。次のようにjQuery関数でラップしました。

$.fn.deepest = function(){
  var $level = this.first();
  while (!!$level.children(":not(br)").length) {
    $level = $level.children();
  }
  return $level;
};


console.log($("div").deepest());
//[ <span>​My text <br>​ Some more text</span>​ ]

を使用.contents()してテキスト ノードを取得し、それらを操作できます。または.text().

于 2013-01-20T14:34:10.803 に答える
0

セレクターとしてターゲットにしBRて、それを置き換えることができます

$('p br').replaceWith('\n');

デモ：http：//jsfiddle.net/fhnHR/1/

最後を分離するために使用する他のBRより高い潜在的な問題がある場合、または最後のものが最も深いレベルにあるかどうかを確認するために使用します。DIV.last()BRfilter()

潜在的な深さと可能なツリー構造を示す、より現実的なhtmlの例をいくつか提供すると役立ちます。それらをフィドルデモに配置して更新することができます

于 2013-01-20T14:21:39.453 に答える
0

次のようにします: http://jsfiddle.net/hWkkJ/2/

jquery:

$(function(){
  $('.append').append($('p').html()); 
});

html:

<div>
<p>
<span>My text <br /> Some more text</span>
</p>
</div>

<div class="append"></div>
于 2013-01-20T14:25:33.127 に答える