Fragment

The Fragment interface represents a minimal document object that has no parent. It is designed for more efficient manipulation.

Example:

import { Fragment } from 'lakelib';

const fragment = new Fragment();
fragment.append('<div>foo</div><div>bar</div>');

Constructor

Creates a new Fragment object.

• Parameters:

  fragment Optional

  A native DocumentFragment object.

Example:

// Without fragment parameter.
const fragment = new Fragment();

// With fragment parameter.
const fragment = new Fragment(document.createDocumentFragment());

Instance methods

get()

Returns a native DocumentFragment object from the fragment.

• Parameters:

  None.

• Return value:

  A native DocumentFragment object.

Example:

const fragment = new Fragment();
const nativeFragment = fragment.get();

find()

Returns the descendants of the fragment that match the specified CSS selector.

• Parameters:

  selector

  A string that specifies CSS selector.

• Return value:

  A Nodes object.

Example:

const nativeFragment = document.createDocumentFragment();
nativeFragment.appendChild(query('<div>foo</div>').get(0));
nativeFragment.appendChild(query('<div>bar</div>').get(0));

const fragment = new Fragment(nativeFragment);
// Outputs "foo".
console.log(fragment.find('div').get(0).innerText);

append()

Inserts the specified content just inside the fragment, after its last child.

• Parameters:

  content

  HTML string, Node, and Nodes object.

• Return value:

  None.

Example:

const fragment = new Fragment();
fragment.append('<div>foo</div><div>bar</div>');