Questions tagged [documentfragment]

a DocumentFragment is a lightweight container that can hold DOM nodes

DocumentFragment is a "lightweight" or "minimal" Document object. It is very common to want to be able to extract a portion of a document's tree or to create a new fragment of a document. Imagine implementing a user command like cut or rearranging a document by moving fragments around. It is desirable to have an object which can hold such fragments and it is quite natural to use a Node for this purpose. While it is true that a Document object could fulfil this role, a Document object can potentially be a heavyweight object, depending on the underlying implementation. What is really needed for this is a very lightweight object. DocumentFragment is such an object.

Syntax

An empty DocumentFragment can be created using the below syntax.

var docFragment = document.createDocumentFragment();

where,

docFragment is a reference to an empty DocumentFragment object.

References

  1. www.w3.org - Interface DocumentFragment
  2. Document Fragment - MDN Link
98 questions
0
votes
1 answer

Append nodes to document fragment along with break tags

Strange situation, couldn't find a solution online. I have some innerHTML inside a contentEditable area which I'm trying to add to a document fragment...and preserve the format, which includes break tags. When I do this: var d =…
denikov
  • 877
  • 2
  • 17
  • 35
0
votes
1 answer

Firefox empties documentFragment on clone

I've found this strange scenario where Firefox seems to loose the content of a documentFragment after cloning it (with the deep flag set to true). Is this a Firefox bug, or am I missing an implementation detail? var n = ( function nScope(){ 'use…
Barney
  • 16,181
  • 5
  • 62
  • 76
0
votes
1 answer

creating a multilevel document fragment

so I am trying to create a multidimensional document fragment and am running into a bit of a road block. I only want to append a document fragment one so that I only create one reflow. I am basically trying to create x number of divs with y number…
0
votes
1 answer

Accessing a nested DocumentFragment

I can navigate the elements perfectly fine in Chrome's console, but I cannot seem to get a reference to the nested DocumentFragment with childNodes or firstChild. Here's the code in jsFiddle: http://jsfiddle.net/Ge8au/2/ Here's the code: function…
Steven Vachon
  • 3,814
  • 1
  • 30
  • 30
0
votes
1 answer

Treating empty document fragments as empty results

What is the most clean way to treat a variable that contains an empty document fragment as an empty variable? I have the following code
gioele
  • 9,748
  • 5
  • 55
  • 80
0
votes
2 answers

forEach only execute the last element of the array

This is my code: var Tree = ( function ( _Obj ) { var _E, _N; _Obj.forEach ( function ( e ) { _E = document.createDocumentFragment(); if ( "tagName" in e ) { _N = document.createElement( e.tagName ); } if (…
-1
votes
1 answer

Javascript: body.append(content) is not rendered as html

I am building a little piece of html document using javascript templates. const button in the code below is my template. As you can see I replace some content using replace. const button become and that's fine. const button =…
sensorario
  • 20,262
  • 30
  • 97
  • 159
-1
votes
1 answer

JavaScript: when string added to DocumentFragment.innerHTML, there are no children, how to fix?

When some html string added to DocumentFragment innerHTML property, there are no children exists. But same action with Element created by createElement show children. I created simple example for comparing innerHTML behavior for DocumentFragment and…
Sergio Ivanuzzo
  • 1,820
  • 4
  • 29
  • 59
1 2 3 4 5 6
7