問題タブ [documentfragment]
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 - documentFragmentで要素を見つける方法はありますか?
ドキュメントにフラグメントを添付する前に「myId」を取得するにはどうすればよいですか?
javascript - domからのノードの選択と操作(jQueryのトリックは何ですか?)
こんにちは私はDOMの選択と操作をDOMからやりたいと思います。
目標は、ウィジェットをdomから構築し、準備ができてからdomに挿入することです。
私の問題は、getElementByIdがドキュメントフラグメントでサポートされていないことです。createElementとcloneNodeも試しましたが、どちらも機能しません。
私はプレーンなjsでそれをやろうとしています。私はそれをうまく処理するjQueryでこれを行うのに慣れています。jQueryソースでトリックを見つけようとしましたが、今のところ成功していません...
オリヴィエ
javascript - documentFragment.cloneNode(true)はjQueryデータのクローンを作成しません
次のように追加された.data()を含むいくつかの子ノードを持つdocumentFragmentがあります。
documentFragmentをページのdivに追加しようとすると:
私はデータにうまくアクセスできます:
しかし、cloneNode(true)を使用してノードのクローンを作成すると、ノードのデータにアクセスできなくなります。:(
他の誰かがこれを行ったか、回避策を知っていますか?行のデータをに格納できると思いますjQuery.data('#some_random_parent_div', 'rows', [array of ids])
が、それでは、各行でデータをすぐに/簡単に利用できるようにするという目的が少し損なわれます。
jQueryがdocumentFragmentsを使用していることも読みましたが、正確にどのように、どのメソッドで使用されているのかわかりません。誰かがそこにこれ以上の詳細を持っていますか?
再編集:.clone(true)
variables - ドキュメントフラグメントではない XSLT の変数を作成するにはどうすればよいですか?
次の XSLT 2.0 テンプレートを検討してください。
このテンプレートの出力は
最初の行は 1 を出力します (私が最初に予想したように 3 ではありませんvar1
) <elem>
。今私の質問のために:
ドキュメントフラグメントを含まない変数を作成するにはどうすればよいですか? var2
で行ったように、述語を除外するだけで実行できます。しかし、2 番目の変数を使用しない方法があるかもしれません。または、別の方法として、一部の要素を除外しながら、ドキュメントのフラグメントを変数に保存するにはどうすればよいですか?
var1
背景情報: 最初の要素を特定の基準でチェックする再帰関数で変数の内容を使用します。基準が満たされるか、要素のリストが空の場合、値を返します。それ以外の場合は、削除されたの最初の要素で自分自身を呼び出しますvar1
(私が で行うようにvar2
)。var1
ドキュメント フラグメントを含むパラメータとして使用すると、テンプレートの XPath 式が一致しません。
jquery - jQuery:生のHTMLへの要素の配列?
次のような配列があるとします。
連結された要素のマークアップを取得する必要があります。したがって、content
" を生の文字列 " "に変換する必要があり<p>...</p><p>...</p>
ます。
これはどのように簡単に行うことができますか?これを行うには、フレームワークにすでに何かがあるはずです。
どういうわけかドキュメント フラグメントに変換content
し、ドキュメント フラグメントを呼び出し.html()
てマークアップを取得することはできますか?
javascript - jquery clone()ユーザーdocumentfragmentは内部的にありますか?
私は要素を動的にdomに挿入しており、そのために次の手順を使用しています:(jquery)初期のdom構造は次のとおりです。
- jquery .clone()を使用して親divのクローンを作成します
- 子divのクローンを作成し、操作を行います
- 複製された親に追加
- すべての子データに対してこれを行う
(parentdiv original).replaceAll(clonedparent)
基本的に、親divのクローンを作成して、ドキュメントフラグメントとして使用できるようにし、domで追加が行われずにパフォーマンスが向上するようにします。
jQueryclone()
はdocumentfragmentのように動作することでパフォーマンス上の利点をもたらしますか?それとも、これを行うためのより良い方法はありますか?子要素の構造はかなり複雑なので、各子要素をHTML文字列として作成したくありません。
javascript - ドキュメントフラグメント
次のコードを見てください。
この場合、変数 myDiv を使用して documentFragement 内に挿入したばかりの div への参照がありますか? 先に進んで、この documentFragement を実際の DOM に追加するとします。この「myDiv」変数を使用して、id="myId" で div にアクセスできますか?
javascript - Range または DocumentFragment を文字列に変換する
W3C 準拠のブラウザーで JavaScript 範囲オブジェクトの html 文字列を取得する方法はありますか?
たとえば、ユーザーが次の項目を選択したとします。 メソッドHello <b>World</b>
を使用して、"Hello World" を文字列として取得できます。Range.toString()
(FirefoxではドキュメントのgetSelection
メソッドでも可能です。)
しかし、内部の HTML を取得する方法が見つからないようです。
DocumentFragment
いくつかの検索の後、範囲をオブジェクトに変換できることがわかりました。
しかし、プロパティDocumentFragments
はありませんinnerHTML
(少なくとも Firefox では。Webkit や Opera は試していません)。
私には奇妙に思えます: 選択したアイテムにアクセスする方法が必要であることは明らかです。
documentFragment
を作成し、ドキュメント フラグメントを別の要素に追加して、その要素の を取得できることに気付きましたinnerHTML
。
しかし、その方法は、選択した領域内の開いているタグを自動的に閉じます。
それに加えて、文字列として取得するためだけにdomに取り付けるよりも、明らかに「より良い方法」があります。
では、Range または DocFrag の html の文字列を取得する方法は?
dom - Creating / wrapping DocumentFragment in MooTools JavaScript library
How to do equivalent of the following pure JavaScript fragment with MooTools
In particular as described in DOM 2 Core after attaching fragment to DOM the original variable x
becomes empty DocumentFragment:
If it [the node to add] is a DocumentFragment object, the entire contents of the document fragment are moved into the child list of this node
Edit (2011-04-13 06:30 UTC):
What I'd like to get is something that behaves both as DocumentFragment from DOM 2 Core, but has all nice methods of Elements from MooTools Core.
javascript - 要素IDの配列に従って要素レイアウトを並べ替えます
次のタスクを実行する必要があります。一意のIDを持ついくつかの「li」を含む2つの「ul」要素があります。
getElementsOrder関数を使用して、要素の番号IDを含む結果の配列を実現します。
ここで、異なる順序の配列からデータを読み取るときli
に、両方の要素を並べ替える機能が必要です。つまり、次のようになります。ul
最もブラウザフレンドリーな方法でこれを行う方法は?document fragment
?を使用する ステップは何ですか?jsfiddleにサンプルがあります: