9

Today I stumbled on createDocumentFragment. I was wondering if the DocumementFragment is supported, and how, on the different browsers, expecially IE series.

Anyone knows anything about this subject?

Eineki
  • 14,773
  • 6
  • 50
  • 59
  • 1
    http://stackoverflow.com/questions/1643349/is-there-any-way-to-find-an-element-in-a-documentfragment/1643383#1643383 See NickFitz's comment. Fragment are treated by IE as documents. http://msdn.microsoft.com/en-us/library/ms536387%28VS.85%29.aspx – Olivvv Dec 08 '09 at 14:35

3 Answers3

13

Yep, it's fully supported in all modern browsers (including IE6).

See: http://www.quirksmode.org/dom/w3c_core.html#miscellaneous

James
  • 109,676
  • 31
  • 162
  • 175
  • 1
    Even though documentFragment is supported by all browsers, the DOM traversal methods like `getElementsByTagName`, `children`, etc. do not work on them. – Livingston Samuel Feb 11 '10 at 18:11
4

In general it has always worked fine as per the DOM spec.

But don't expect non-standard extensions to work seamlessly... for example you can't set innerHTML on a DocumentFragment (which is a shame as it could have greatly improved insertion speed on some large pages).

bobince
  • 528,062
  • 107
  • 651
  • 834
  • 1
    but you can create a holder `div` with `document.createElement` and add the string as `innerHTML` to the `div`, and then finally append the `div` to the `documentFragment` – Livingston Samuel Feb 11 '10 at 18:13
  • Yes, but that gives no performance advantage over just operating directly on the `div`. The idea would be to speed up operations like adding many rows to a table, that are typically slow with node-by-node DOM methods. You can do a lot of this by combining fragments with `Range` objects, except that browser implementations of DOM Level 2 TR (especially IE's) aren't completely there yet. – bobince Feb 11 '10 at 18:40
4
         ╔═════════════════════════════════╗
         ║ document.createDocumentFragment ║
╔════════╬═════════════════════════════════╣
║ IE5    ║ true                            ║
║ IEM5.2 ║ true                            ║
║ IE5.5  ║ false                           ║
║ IE6+   ║ true                            ║
║ OPM6+  ║ true                            ║
║ OP7+   ║ true                            ║
║ N6+    ║ true                            ║
║ KQ     ║ true                            ║
╚════════╩═════════════════════════════════╝

Beware though, existence doesn't always entails implementation.

Gotchas

  • IE Mac 5.2 on Mac cannot add text nodes to document fragments, nor append the fragment's contents to a document.
  • Opera 7.2 creates the fragment but does not apply styles to the created elements.
Knu
  • 14,806
  • 5
  • 56
  • 89