1. ホーム
  2. jquery

[解決済み] .text()を使って子タグにネストされていないテキストのみを取得する方法

2022-03-23 19:33:52

質問

このようなhtmlがあった場合。

<li id="listItem">
    This is some text
    <span id="firstSpan">First span text</span>
    <span id="secondSpan">Second span text</span>
</li>

を使おうとしているのですが .text() という文字列だけを取得することができます。 $('#list-item').text() と表示され、quot;This is some textFirst span textSecond span text"と表示されます。

を取得する(場合によっては削除する)方法はありますか? .text("") ) タグ内のフリーテキストだけで、その子タグ内のテキストは含まれないのですか?

HTMLは私が書いたものではないので、こんなものです。htmlを書くときにテキストをタグで囲めば簡単なのは分かっているのですが、やはりhtmlはあらかじめ書かれているものです。

どのように解決するのですか?

をベースとした再利用可能な実装が気に入りました。 clone() メソッドが見つかりました。 こちら で、親要素の中のテキストだけを取得することができます。

簡単に参照できるようにコードを用意しました。

$("#foo")
    .clone()    //clone the element
    .children() //select all the children
    .remove()   //remove all the children
    .end()  //again go back to selected element
    .text();