A minimal document object that has no parent. It is used as a lightweight version of Document that stores a segment of a document structure comprised of nodes just like a standard document. The key difference is that because the document fragment isn't part of the active document tree structure, changes made to the fragment don't affect the document, cause reflow, or incur any performance impact that can occur when changes are made.

MDN Reference

interface DocumentFragment {
    ATTRIBUTE_NODE: 2;
    baseURI: string;
    CDATA_SECTION_NODE: 4;
    childElementCount: number;
    childNodes: NodeListOf<ChildNode>;
    children: HTMLCollection;
    COMMENT_NODE: 8;
    DOCUMENT_FRAGMENT_NODE: 11;
    DOCUMENT_NODE: 9;
    DOCUMENT_POSITION_CONTAINED_BY: 16;
    DOCUMENT_POSITION_CONTAINS: 8;
    DOCUMENT_POSITION_DISCONNECTED: 1;
    DOCUMENT_POSITION_FOLLOWING: 4;
    DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: 32;
    DOCUMENT_POSITION_PRECEDING: 2;
    DOCUMENT_TYPE_NODE: 10;
    ELEMENT_NODE: 1;
    ENTITY_NODE: 6;
    ENTITY_REFERENCE_NODE: 5;
    firstChild: null | ChildNode;
    firstElementChild: null | Element;
    isConnected: boolean;
    lastChild: null | ChildNode;
    lastElementChild: null | Element;
    nextSibling: null | ChildNode;
    nodeName: string;
    nodeType: number;
    nodeValue: null | string;
    NOTATION_NODE: 12;
    ownerDocument: Document;
    parentElement: null | HTMLElement;
    parentNode: null | ParentNode;
    previousSibling: null | ChildNode;
    PROCESSING_INSTRUCTION_NODE: 7;
    TEXT_NODE: 3;
    textContent: null | string;
    addEventListener(type: string, callback: null | EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
    append(...nodes: (string | Node)[]): void;
    appendChild<T>(node: T): T;
    cloneNode(deep?: boolean): Node;
    compareDocumentPosition(other: Node): number;
    contains(other: null | Node): boolean;
    dispatchEvent(event: Event): boolean;
    getElementById(elementId: string): null | HTMLElement;
    getRootNode(options?: GetRootNodeOptions): Node;
    hasChildNodes(): boolean;
    insertBefore<T>(node: T, child: null | Node): T;
    isDefaultNamespace(namespace: null | string): boolean;
    isEqualNode(otherNode: null | Node): boolean;
    isSameNode(otherNode: null | Node): boolean;
    lookupNamespaceURI(prefix: null | string): null | string;
    lookupPrefix(namespace: null | string): null | string;
    normalize(): void;
    prepend(...nodes: (string | Node)[]): void;
    querySelector<K>(selectors: K): null | HTMLElementTagNameMap[K];
    querySelector<K>(selectors: K): null | SVGElementTagNameMap[K];
    querySelector<K>(selectors: K): null | MathMLElementTagNameMap[K];
    querySelector<K>(selectors: K): null | HTMLElementDeprecatedTagNameMap[K];
    querySelector<E>(selectors: string): null | E;
    querySelectorAll<K>(selectors: K): NodeListOf<HTMLElementTagNameMap[K]>;
    querySelectorAll<K>(selectors: K): NodeListOf<SVGElementTagNameMap[K]>;
    querySelectorAll<K>(selectors: K): NodeListOf<MathMLElementTagNameMap[K]>;
    querySelectorAll<K>(selectors: K): NodeListOf<HTMLElementDeprecatedTagNameMap[K]>;
    querySelectorAll<E>(selectors: string): NodeListOf<E>;
    removeChild<T>(child: T): T;
    removeEventListener(type: string, callback: null | EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    replaceChild<T>(node: Node, child: T): T;
    replaceChildren(...nodes: (string | Node)[]): void;
}

Hierarchy (view full)

Properties

ATTRIBUTE_NODE
baseURI: string

Returns node's node document's document base URL.

MDN Reference

CDATA_SECTION_NODE

node is a CDATASection node.

childElementCount: number
childNodes: NodeListOf<ChildNode>

Returns the children.

MDN Reference

children: HTMLCollection

Returns the child elements.

MDN Reference

COMMENT_NODE

node is a Comment node.

DOCUMENT_FRAGMENT_NODE

node is a DocumentFragment node.

DOCUMENT_NODE

node is a document.

DOCUMENT_POSITION_CONTAINED_BY

Set when other is a descendant of node.

DOCUMENT_POSITION_CONTAINS

Set when other is an ancestor of node.

DOCUMENT_POSITION_DISCONNECTED

Set when node and other are not in the same tree.

DOCUMENT_POSITION_FOLLOWING

Set when other is following node.

DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC
DOCUMENT_POSITION_PRECEDING

Set when other is preceding node.

DOCUMENT_TYPE_NODE

node is a doctype.

ELEMENT_NODE

node is an element.

ENTITY_NODE
ENTITY_REFERENCE_NODE
firstChild: null | ChildNode

Returns the first child.

MDN Reference

firstElementChild: null | Element

Returns the first child that is an element, and null otherwise.

MDN Reference

isConnected: boolean

Returns true if node is connected and false otherwise.

MDN Reference

lastChild: null | ChildNode

Returns the last child.

MDN Reference

lastElementChild: null | Element

Returns the last child that is an element, and null otherwise.

MDN Reference

nextSibling: null | ChildNode

Returns the next sibling.

MDN Reference

nodeName: string

Returns a string appropriate for the type of node.

MDN Reference

nodeType: number

Returns the type of node.

MDN Reference

nodeValue: null | string
NOTATION_NODE
ownerDocument: Document

Returns the node document. Returns null for documents.

MDN Reference

parentElement: null | HTMLElement

Returns the parent element.

MDN Reference

parentNode: null | ParentNode

Returns the parent.

MDN Reference

previousSibling: null | ChildNode

Returns the previous sibling.

MDN Reference

PROCESSING_INSTRUCTION_NODE

node is a ProcessingInstruction node.

TEXT_NODE

node is a Text node.

textContent: null | string

Methods

  • Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched.

    The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture.

    When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET.

    When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in § 2.8 Observing event listeners.

    When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed.

    If an AbortSignal is passed for options's signal, then the event listener will be removed when signal is aborted.

    The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture.

    MDN Reference

    Parameters

    Returns void

  • Inserts nodes after the last child of node, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    MDN Reference

    Parameters

    • Rest...nodes: (string | Node)[]

    Returns void

  • Returns a copy of node. If deep is true, the copy also includes the node's descendants.

    MDN Reference

    Parameters

    • Optionaldeep: boolean

    Returns Node

  • Returns a bitmask indicating the position of other relative to node.

    MDN Reference

    Parameters

    Returns number

  • Returns true if other is an inclusive descendant of node, and false otherwise.

    MDN Reference

    Parameters

    Returns boolean

  • Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise.

    MDN Reference

    Parameters

    • event: Event

    Returns boolean

  • Returns whether node has children.

    MDN Reference

    Returns boolean

  • Parameters

    • namespace: null | string

    Returns boolean

  • Returns whether node and otherNode have the same properties.

    MDN Reference

    Parameters

    • otherNode: null | Node

    Returns boolean

  • Parameters

    • otherNode: null | Node

    Returns boolean

  • Parameters

    • prefix: null | string

    Returns null | string

  • Parameters

    • namespace: null | string

    Returns null | string

  • Removes empty exclusive Text nodes and concatenates the data of remaining contiguous exclusive Text nodes into the first of their nodes.

    MDN Reference

    Returns void

  • Inserts nodes before the first child of node, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    MDN Reference

    Parameters

    • Rest...nodes: (string | Node)[]

    Returns void

  • Replace all children of node with nodes, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    MDN Reference

    Parameters

    • Rest...nodes: (string | Node)[]

    Returns void