CKEditor Ecosystem Documentation
Search
Report an issue
Home/CKEditor 4/API
Class

CKEDITOR.dom.documentFragment

class
See source

DocumentFragment is a "lightweight" or "minimal" Document object. It is commonly used to extract a portion of the document's tree or to create a new fragment of the document. Various operations may take document fragment objects as arguments and result in all the child nodes of the document fragment being moved to the child list of this node.

Filtering

Properties

Methods

  • constructor( [ nodeOrDoc ] ) → documentFragment

    Creates a document fragment class instance.

    See source

    Parameters

    [ nodeOrDoc ] : document | DocumentFragment

    Defaults to CKEDITOR.document

    Returns

    documentFragment

  • append( node, [ toStart ] ) → node

    Append a node as a child of this element.

    See source
    var p = new CKEDITOR.dom.element( 'p' );

var strong = new CKEDITOR.dom.element( 'strong' );
p.append( strong );

var em = p.append( 'em' );

// Result: '<p><strong></strong><em></em></p>'

    Parameters

    node : node | String

    The node or element name to be appended.

    [ toStart ] : Boolean

    Indicates that the element is to be appended at the start.

    Defaults to false

    Returns

    node

    The appended node.

  • appendBogus( [ force ] )

    Appends a <br> filler element to this element if the filler is not present already. By default filler is appended only if CKEDITOR.env.needsBrFiller is true, however when force is set to true filler will be appended regardless of the environment.

    See source

    Parameters

    [ force ] : Boolean

    Append filler regardless of the environment.

  • appendTo( element ) → element

    Makes this node a child of another element.

    See source
    var p = new CKEDITOR.dom.element( 'p' );
var strong = new CKEDITOR.dom.element( 'strong' );
strong.appendTo( p );

// Result: '<p><strong></strong></p>'.

    Parameters

    element : element

    The target element to which this node will be appended.

    Returns

    element

    The target element.

  • clone( [ includeChildren ], [ cloneId ] ) → node

    Clones this node.

    See source

    Note: Values set by {#setCustomData} will not be available in the clone.

    Parameters

    [ includeChildren ] : Boolean

    If true then all node's children will be cloned recursively.

    Defaults to false

    [ cloneId ] : Boolean

    Whether ID attributes should be cloned, too.

    Defaults to false

    Returns

    node

    Clone of this node.

  • find( selector ) → nodeList

    since 4.12.0

    Wrapper for querySelectorAll. Returns a list of elements within this document that match the specified selector.

    See source

    Note: The returned list is not a live collection (like the result of native querySelectorAll).

    Parameters

    selector : String

    A valid CSS selector.

    Returns

    nodeList

  • findOne( selector ) → element

    since 4.12.0

    Wrapper for querySelector. Returns the first element within this document that matches the specified selector.

    See source

    Parameters

    selector : String

    A valid CSS selector.

    Returns

    element

  • getChild( indices ) → node

    Gets a DOM tree descendant under the current node.

    See source
    var strong = p.getChild( 0 );

    Parameters

    indices : Array | Number

    The child index or array of child indices under the node.

    Returns

    node

    The specified DOM child under the current node. Null if child does not exist.

  • getChildCount() → Number

    Gets number of element's children.

    See source

    Returns

    Number

  • getChildren() → nodeList

    Gets the nodes list containing all children of this element.

    See source

    Returns

    nodeList

  • getDocument() → document

    Gets the document containing this element.

    See source
    var element = CKEDITOR.document.getById( 'example' );
alert( element.getDocument().equals( CKEDITOR.document ) ); // true

    Returns

    document

    The document.

  • getFirst( evaluator ) → node

    Gets the first child node of this element.

    See source
    var element = CKEDITOR.dom.element.createFromHtml( '<div><b>Example</b></div>' );
var first = element.getFirst();
alert( first.getName() ); // 'b'

    Parameters

    evaluator : Function

    Filtering the result node.

    Returns

    node

    The first child node or null if not available.

  • getHtml() → String

    since 4.5.0

    Gets the HTML of this document fragment's children.

    See source

    Returns

    String

    The HTML of this document fragment's children.

  • getLast( evaluator ) → node

    See getFirst.

    See source

    Parameters

    evaluator : Function

    Filtering the result node.

    Returns

    node

  • getNext( [ evaluator ] ) → node

    Gets the node that follows this element in its parent's child list.

    See source
    var element = CKEDITOR.dom.element.createFromHtml( '<div><b>Example</b><i>next</i></div>' );
var last = element.getFirst().getNext();
alert( last.getName() ); // 'i'

    Parameters

    [ evaluator ] : Function

    Filtering the result node.

    Returns

    node

    The next node or null if not available.

  • getParent( [ allowFragmentParent ] ) → element

    Gets the parent element for this node.

    See source
    var node = editor.document.getBody().getFirst();
var parent = node.getParent();
alert( parent.getName() ); // 'body'

    Parameters

    [ allowFragmentParent ] : Boolean

    Consider also parent node that is of fragment type CKEDITOR.NODE_DOCUMENT_FRAGMENT.

    Defaults to false

    Returns

    element

    The parent element.

  • getPrevious( [ evaluator ] ) → node

    Gets the node that preceeds this element in its parent's child list.

    See source
    var element = CKEDITOR.dom.element.createFromHtml( '<div><i>prev</i><b>Example</b></div>' );
var first = element.getLast().getPrev();
alert( first.getName() ); // 'i'

    Parameters

    [ evaluator ] : Function

    Filtering the result node.

    Returns

    node

    The previous node or null if not available.

  • insertAfterNode( node )

    Inserts the document fragment content after the specified node.

    See source

    Parameters

    node : node

  • insertBefore( node ) → node

    Inserts this element before a node.

    See source
    var em = new CKEDITOR.dom.element( 'em' );
var strong = new CKEDITOR.dom.element( 'strong' );
strong.insertBefore( em );

// result: '<strong></strong><em></em>'

    Parameters

    node : node

    The node that will succeed this element.

    Returns

    node

    The node being inserted.

  • ltrim()

    See source

  • moveChildren( target, [ toStart ] )

    Moves this element's children to the target element.

    See source

    Parameters

    target : element
    [ toStart ] : Boolean

    Insert moved children at the beginning of the target element.

    Defaults to false

  • replace()

    See source

  • rtrim()

    See source

  • trim()

    See source