DOM を変更せずに要素からテキスト ノードを抽出するにはどうすればよいですか?

DOM 構造を変更せずにテキスト ノードを取得する

特定のシナリオでは、構造を変更せずに要素のテキスト コンテンツを抽出することが必要になります。 。たとえば、次の HTML コードでは:

<div>

「edit」タグを保持しながら「I am text node」というテキストを取得することが目的の出力である場合、クロスブラウザー ソリューションが必要です。

JavaScript の Element.contents() とNode.TEXT_NODE

これを実現するには、JavaScript の Element.contents() プロパティと Node.TEXT_NODE プロパティを利用できます。簡潔かつ効果的なコード スニペットを次に示します。

var text = $(".title").contents().filter(function() {
  return this.nodeType == Node.TEXT_NODE;
}).text();

ソリューションの詳細:

• $(".title").contents(): This関数は、クラスを持つ選択された要素内のすべての直接の子ノードのコレクションを返します。 "title".
• .filter(): フィルター関数は各子ノードをループし、Node.TEXT_NODE 型の子ノードのみを返します。
• .text(): このメソッドは、

したがって、この手法を使用すると、「I am text ノード」部分を問題なく取得できます。 HTML 構造を変更します。このソリューションはすべての主要な Web ブラウザと互換性があり、クロスブラウザ機能を保証します。

以上がDOM を変更せずに要素からテキスト ノードを抽出するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。