1

DocumentFragment と querySelector を使用して DocumentFragments を作成および変更したいと考えています。HTML 文字列からフラグメントを作成するために、DocumentFragment に任意の HTML を挿入することからいくつかのコードを使用しています。

stringToDocumentFragment = function(html_string) {
    var frag = document.createDocumentFragment();
    var holder = document.createElement("div")
    holder.innerHTML = html_string
    frag.appendChild(holder)
    return frag
}

そしてそれは動作します：

test_one = stringToDocumentFragment('<one><two>test</two></one>')
#document-fragment

test_one.querySelector('one')
> <one>...</one>

<html>ただし、またはのような要素を使用する<body>と、失敗します。

test_two = stringToDocumentFragment('<html><body>test</body></html>')
#document-fragment

test_two.querySelector('html')
null

動作は、Chrome と Firefox の両方で同じです。

4

1 に答える 1

2

ドキュメント フラグメントは、ドキュメント全体ではなく、ドキュメントの一部であることを意味します。したがって、ドキュメント フラグメントに<body>andを含めることはできません。<html>ドキュメントのポイントは、多数の最上位要素 (ドキュメントの一部) を作成または保存する方法を持つことです。実際のドキュメントに挿入すると、最上位のコンテナではなく、内部の要素のみが挿入されます。

html と body 部分を含む実際のドキュメントが必要な場合は、フラグメントではなくドキュメントを作成します。

セレクター操作を使用できるようにするだけの場合は、フラグメントを使用する必要はまったくありません。div を作成し、div に innerHTML を設定し、div で querySelector 操作を使用するだけです。そのためのドキュメントフラグメントは必要ありません。

于 2012-05-27T20:44:26.223 に答える