問題タブ [textnode]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 親要素を持つテキスト ノードを順番に取得する (見た目より難しい)
次のマークアップを検討してください。
次のように、テキスト ノードとそれらを含む要素を順番に取得する必要があります。
1: "Hello, my "
, <div>
(HTML要素)
2: "name"
, <span>
(HTML要素)
3: " is John"
, <div>
(HTML要素)
これは、後で HTMLElements の CSS スタイルを取得できるようにする必要があります。
私がすでに試したこと:
これにより、次のように不連続な結果セットが生成されます。
1:"Hello, my "
2:" is John"
3:"name"
ただし、親要素にアクセスできるので、これで仕事の半分は完了します。
したがって、主な問題は、ドキュメント内と同じ順序でテキスト ノードを取得するにはどうすればよいかということです。
javascript - テキストのinnerHTMLに相当
重複の可能性:
jQueryの.text()は内部的にどのように機能しますか?
innerHTML
に相当するテキストを探しています。
その後、innerText(p)
を返す必要がありHello, World!
ます。
注:私はjQueryのtext()
機能を知っています。余分な空白を挿入するなど、一部のノードで特別な処理を実行できるように、どのように実装されているかを知りたいです。
html - 単純なドキュメントで空のテキスト ノードを取得するのはなぜですか
この単純なコードを考えると
次のように、IE9 で多くの空のテキスト ノードを取得します。
同様の質問をした後、次のことを試しました。
- すべてのタグを閉じます。
- すべての空白を削除します。
- BOM なしで UTF を使用する
- EOL = UNIX形式
それは役に立ちません。これがなぜなのかを真剣に知りたい人はいません。
javascript - 要素の後にテキストノードを取得する方法は?
jQueryを使用します。私は次のhtmlを持っています:
テキストだけを取得するにはどうすればよいですか。どのセレクターを使用する必要がありますか?(「全世界」が必要です)
HTMLにも触れられません...
javascript - JavaScript はすべてのテキスト ノードを検索し、文字列で返します
指定したノードまたはその下にあるすべての Text ノードを検索し、ノードのテキスト コンテンツを抽出して連結し、単一の JavaScript 文字列として返す getText() という名前の関数を定義する必要があります。getText() では、呼び出されるのはアラートになります
私の体の内容は次のとおりです。
javascript - IE8以下では未定義のJavascript「ノード」
IE8以下を除くすべてのブラウザで正常に動作するように見える次のコードがあります。
要素のコンテンツを取得し、子要素に含まれるすべてのものを取り除き、その要素のテキストを残します。
私が得るエラーはそれNode
が未定義であると言っています-それで私はそれをjsファイルの先頭で宣言し、それから同じメッセージを受け取るTEXT_NODE
のでそれを宣言します。次に、次のエラーが発生します。
Unable to get property 'TEXT_NODE' of undefined or null reference
誰かが私がこれを修正するのを手伝ってくれるか、誰かが同じ結果を得るためのより良い方法を考えることができますか?ありがとう。
dom - Knockout.jsテキストバインディング-複数のスペースが折りたたまれています
Knockoutのテキストバインディングを使用すると、複数のスペースが1つに折りたたまれるようになります。例えば:
function VM(){this.Notes = ko.observable(); }
var vm = new VM();
ko.applyBindings(vm);
これを実証するためのフィドルは次のとおりです:http://jsfiddle.net/9rtL5/
jsfiddleでは、Firefox、Chrome、IE9でスペースが圧縮されていることがわかりました。不思議なことに、私のアプリ内ではIE9はそれらを圧縮しませんが、他のものは圧縮します。
私の理解では、KnockoutはHTMLテキストノードを使用して値をレンダリングします。テキストノードを作成するときにスペースを保持することについて、この関連する質問を見つけました。
Knockoutは変換スペースを適切に処理する必要がありますか?これにカスタムバインディングハンドラーを使用したくありません。
私は実際にselect内の表示テキストのコンテキストでこれに遭遇し、その問題をデバッグしているときに、単純なテキストバインディングにも関連していることを発見しました。選択した問題は同じだと思います。
jquery - jQueryで任意のテキストノード選択を実装する方法
最近、いくつかの jQuery セレクターにテキスト ノード選択を組み込む必要があることに気が付きました。
jQuery は、本来テキストノードをサポートしていません。このタイプの質問に関するほとんどの回答では使用.contents()
が推奨されていますが、これは実際には「セレクター」ではなく「トラバース」に分類されます。そのため、直接の子のみを提供し、テキスト ノードだけでなく、すべての子を提供します。
任意にマークアップされたテキスト内のすべてのテキスト ノードを選択する必要があることがわかったので、関心のあるテキスト ノードのいくつかは孫、ひ孫などになります。
したがって、再帰呼び出しを実装しようとするのではなく、これを実現する最も表現力豊かな方法は.children()
、jQuery セレクターを次のように拡張することです。
Where§
は、テキスト ノードを表す jQuery に追加する新しい構文を表します。:odd()
未使用の ASCII シンボルまたは拡張子のようなものを見つける必要があります。
jQuery のセレクター エンジンをこのように拡張するにはどうすればよいでしょうか。既存の DOM-walking メソッドにフックしたいので、新しいメソッドを構築する必要はないと思いますか?
それとも、.contents()
jQuery を拡張しなくても、思いもよらないことを行う表現力のあるトリックがあるのでしょうか。
私の使用例: ユーザースクリプト (greasemonkey など) で、サードパーティの Web サイトからのテキストのカスタム「ハイライト」を実行したいと考えています。「カスタム」とは、さまざまなパターンがさまざまなbackground-color
s などを取得することを意味します。そのため、深さに関係なくすべてのテキストノードが必要であり、それらの周りにタグを付けたくなく、すべてのテキストを 1 つの大きなチャンクにまとめたくありません.text()
。ください。
javascript - セレクターの第一級市民としてtextNodesをサポートするjQuery/sizzleに代わるものはありますか?
textNode
jQueryが提供していないDOMを完全にサポートするセレクターが必要であることがわかりました。
jQueryはテキストノードを無視します。これはおそらく、ほとんどのページのタグ間に無関係な空白のノードが大量にあり、さまざまなブラウザで異なる方法で処理できるためです。
テキストノードに関するjQueryの質問に対するほとんどの回答は、.contents()
テキストノードを含む選択されたアイテムのすべての子ノードを返す関数を使用することになります。他のすべてのjQueryAPIはテキストノードを無視します。
多くの場合、簡単に構築できないものは必要ありませんが.contents()
、私はそのような状況にいることに気づきました。
私の使用例は、私が制御できないサードパーティのWebページで、任意のテキストの実行を見つけてラップしたいというものです。(ブラウザ拡張機能またはユーザースクリプトを考えてください。)
これまでのところ、すべてのテキストノードを探してDOMを歩き回ったり、関心のあるすべてのテキストノードを含むラッパー要素を見つけたりして、.contents()
それらを反復処理することができます。
しかし今では、クラス内のクラスなどの特定の可能性に焦点を絞るために、jQuery/sizzleセレクターのフルパワーが必要になることがあります。
セレクターを使用してjQueryを拡張する方法を検討しましたtextNode
が、拡張機能が呼び出される前にテキストノードの多くをフィルターで除外するという一般的なルールがあるため、それは不可能のようです。
したがって、セレクターのようなものを提供するが、セレクター式の構文に任意に混合されたテキストノードを選択できる他のJavaScriptツールを探しています。
これが私がする必要があるかもしれないことの例です:
これは私が個人的にまだ必要としない例ですが、簡単に想像できます:
textNodeの直接の親をアドレス指定(選択)できる場合、それらの反復.contents()
は簡単です。任意の祖先のみを識別でき、この下のすべてのテキストノードが必要な場合は、もちろん要素ノードでは簡単です。 。
javascript - childNodes の予期しない動作
DOM のトラバースをより適切に処理するために、いくつかの単純な HTML および JS コードをセットアップしました。
ここに私のHTMLがあります:
そして、ここに私のJavaScriptがあります:
ただし、取得するコンソールログは次のとおりです。
何を与える?テキスト ノードは一体どこにあるのでしょうか。それはタイトル ノードではありませんか? 私は混乱していて、たくさん遊んでいます(jsによると、実際にはbodyノードがHEADの3番目の子であることがわかりましたが、HTMLを見ると意味がありません)。3番目の子孫か何かであることがわかりましたが、子供は直接の子供を意味すると思いました...助けていただければ幸いです!