The DocumentFragment object
represents a light-weight Document object, which can hold a portion of an existing
document's tree, or a new fragment which can then be inserted into a
document. As such it is very useful for 'cut and paste' operations. A
DocumentFragment can be a child of a Document object,
whereas another document cannot be.
One particularly useful
feature, especially when adding sibling nodes to a document, is that
when used in insert operations it is the child nodes that are inserted
rather than the DocumentFragment itself. The DocumentFragment
just acts as the parent of these nodes so that standard Node methods such as appendChild and insertBefore can be
used.
The children of a
DocumentFragment node are zero or more nodes representing the
tops of any sub-trees defining the structure of the document. A
DocumentFragment does not need to be a well-formed XML document,
but it does need to comply with the rules imposed upon well-formed XML
parsed entities, which can have multiple top nodes. For example, a
DocumentFragment could have only one child consisting of a Text node, which represents neither an HTML
document nor a well-formed XML document.
A DocumentFragment has no methods or properties of its own, but as a Node it inherits various of that object's properties and methods. For details of the values returned by the nodeName, nodeType and nodeValue properties for a DocumentFragment, see the Node object.
XML:
<names>
<name>Alice</name>
<name>Bert</name>
<name>Charlie</name>
<name>Diane</name>
<name>Eric</name>
</names>
JavaScript:
xml_doc = new ActiveXObject("Microsoft.XMLDOM");
xml_doc.async = false;
xml_doc.load("names.xml");
function add_elem(frag, elem, text)
{
var new_elem = xml_doc.createElement(elem);
var new_text = xml_doc.createTextNode(text);
new_elem.appendChild(new_text);
frag.appendChild(new_elem);
}
doc_frag = xml_doc.createDocumentFragment();
add_elem(doc_frag, "name", "Billy");
add_elem(doc_frag, "name", "Bobby");
add_elem(doc_frag, "name", "Bonnie");
root = xml_doc.documentElement;
root.insertBefore(doc_frag, root.childNodes.item(2));
names = xml_doc.getElementsByTagName("name");
n_names = names.length;
for (i = 0; i < n_names; i++)
document.write(names[i].firstChild.nodeValue + "<br>");
To demonstrate how a DocumentFragment can be used, we create one for the 'names.xml' file to which we shall add three child nodes consisting of new 'name' elements. The whole entity will then be inserted into an appropriate place among the children of the document's root element. Finally the values of all the 'name' elements will be displayed. (The code uses a user-defined function to create and add the child nodes to the DocumentFragment.)
Syntax: node.attributes
This is a read-only property that returns a NamedNodeMap for nodes that can have attributes.
Syntax: document.basename
This is a read-only property that returns the base name for a node.
Syntax: node.childNodes
This is a read-only property containing a node list of all children for those elements that can have them.
Syntax: node.dataType
This is a read-only property that specifies the data type for the node.
Syntax: node.definition
This property returns the definition of the node in the DTD or schema.
Syntax: node.firstChild
This is a read-only property that returns the first child node of a node. If there is none, it returns null.
Syntax: node.lastChild
This is a read-only property that returns the last child node of a node. If there is none, it returns null.
Syntax: object.namespaceURI
This property is read-only and returns the URI (Universal Resource Indentifier) of the namespace.
Syntax: node.nextSibling
This property returns the next node in the parent's child list, or null if there is none or the node is of a type that cannot be a child node (Attr, Document, DocumentFragment).
Syntax: node.nodeName
This property is read-only and contains the name of the node, depending on type.
Syntax: node.nodeType
This property is read-only and contains the name of the node, depending on type.
Syntax: node.nodeTypedValue
This property contains the value of this node expressed in its defined data type.
Syntax: node.nodeTypeString
This property is read-only and returns the node type in string form.
Syntax: node.nodeValue
This property contains the value of the node, depending on type.
Syntax: node.ownerDocument
This property returns the Document object to which the node belongs. If the node itself is a document, then it returns null.
Syntax: node.parentNode
This is a read-only property that returns the parent node of all nodes except Document, DocumentFragment and Attr, which cannot have parent nodes.
Syntax: node.parsed
This property returns a boolean value of true if this node and all of its descendants have been parsed and instantiated. Otherwise it returns false.
Syntax: object.prefix
Property This property is read-only and returns the namespace prefix, or an empty string if none is specified. For example, it would return 'xxx' for the element xxx:yyy.
Syntax: node.previousSibling
This property returns the previous node in the parent's child list, or null if there is none or the node is of a type that cannot be an child node (Attr, Document, DocumentFragment).
Syntax: node.specified
This property returns a boolean value which indicates whether or not this attribute has a value specified in the XML document.
Syntax: node.text
This property contains the text content of this node and its subtrees.
Syntax: node.xml
This property contains the XML representation of this node and its descendants.
Syntax: node.appendChild(tagName)
This method appends a new child node to the list of children for this node.
Syntax: node.cloneNode(deep)
This method creates a clone node which is an exact replica of this node.
Syntax: node.hasChildNodes
This method is a convenient way to determine whether a node has child nodes, returning true if it has, and false if not.
Syntax: node.insertBefore(newChild, refChild)
This method is used to insert a new child node before an existing one. If no child node exists, the new child node becomes the first.
Syntax: node.removeChild(oldChild)
This method removes the specified node from the list of children and returns it.
Syntax: node.replaceChild(newChild, oldChild)
This method is used to replace one of a node's children with another. It returns the old child.
Syntax: node.selectNodes(patternString)
This method creates a NodeList of all matching descendant nodes returned by the specified pattern-matching operation.
Syntax: node.selectSingleNode(patternString)
This method returns an object for the first descendant node to match the specified pattern.
Syntax: node.transformNode(stylesheet)
This method processes this node and its descendants using the specified XSL stylesheet, and returns the resulting transformation.
Syntax: node.transformNodeToObject(stylesheet, outputObject)
This method processes this node and its descendants using the specified XSL stylesheet, and returns the resulting transformation in the specified object.