    import YXmlFragment from 'yjs/src/Types/YXml/YXmlFragment.js'

public class | source

# YXmlFragment

#### Extends:

Item → Type → YArray → YXmlFragment

Represents a list of YXmlElement.and YXmlText types. A YxmlFragment is similar to a YXmlElement, but it does not have a nodeName and it does not have attributes. Though it can be bound to a DOM element - in this case the attributes and the nodeName are not shared.

## Method Summary

Public Methods
public | createTreeWalker (filter: Function): TreeWalker Create a subtree of childNodes. |
public | querySelector (query: CSS_Selector): YXmlElement Returns the first YXmlElement that matches the query. |
public | querySelectorAll (query: CSS_Selector): Array<YXmlElement> Returns all YXmlElements that match the query. |
public | toDom (_document: Document, hooks: Object<key:hookDefinition>, binding: DomBinding): Element Creates a Dom Element that mirrors this YXmlElement. |
public | toString (): string Get the string representation of all the children of this YXmlFragment. |

## Inherited Summary

From class Type
public | getPathTo (type: YType): Array<string> Compute the path from this type to the specified target. |
public | observe (f: Function) Observe all events that are created on this type. |
public | observeDeep (f: Function) Observe all events that are created by this type and its children. |
public | unobserve (f: Function) Unregister an observer function. |
public | unobserveDeep (f: Function) Unregister an observer function. |

From class YArray
public get | length : * Computes the length of this YArray. |
public | [Symbol.iterator] (): {"next": *, "_item": *, "_itemElement": *, "_count": *} |
public | delete (index: Integer, length: Integer) Deletes elements starting from an index. |
public | forEach (f: Function) Executes a provided function on once on overy element of this YArray. |
public | get (index: Integer): * Returns the i-th element from a YArray. |
public | insert (index: Integer, content: Array) Inserts new content at an index. |
public | map (f: Function): Array Returns an Array with the result of calling a provided function on every element of this YArray. |
public | push (content: Array) Appends content to this YArray. |
public | toArray (): Array Transforms this YArray to a JavaScript Array. |
public | toJSON (): Array Transforms this Shared Type to a JSON object. |

## Public Methods

### public createTreeWalker(filter: Function): TreeWalker source

Create a subtree of childNodes.

#### Params:

Name | Type | Attribute | Description
filter | Function |  | Function that is called on each child element and returns a Boolean indicating whether the child is to be included in the subtree.

#### Return:

TreeWalker | A subtree and a position within it.

#### Example:

    const walker = elem.createTreeWalker(dom => dom.nodeName === 'div')
    for (let node in walker) {
      // `node` is a div node
      nop(node)
    }

### public querySelector(query: CSS_Selector): YXmlElement source

Returns the first YXmlElement that matches the query. Similar to DOM's querySelector.

Query support:

- tagname TODO:
- id
- attribute

#### Params:

Name | Type | Attribute | Description
query | CSS_Selector |  | The query on the children.

#### Return:

YXmlElement (nullable: true) | The first element that matches the query or null.

### public querySelectorAll(query: CSS_Selector): Array<YXmlElement> source

Returns all YXmlElements that match the query. Similar to Dom's querySelectorAll.

TODO: Does not yet support all queries. Currently only query by tagName.

#### Params:

Name | Type | Attribute | Description
query | CSS_Selector |  | The query on the children

#### Return:

Array<YXmlElement> | The elements that match this query.

### public toDom(_document: Document, hooks: Object<key:hookDefinition>, binding: DomBinding): Element source

Creates a Dom Element that mirrors this YXmlElement.

#### Params:

Name | Type | Attribute | Description

_document

Document

- optional
- default: document

The document object (you must define this when calling this method in nodejs)

hooks

Object<key:hookDefinition>

- optional
- default: {}

Optional property to customize how hooks are presented in the DOM

binding

DomBinding

- optional

You should not set this property. This is used if DomBinding wants to create a association to the created DOM type

#### Return:

Element | The {@link https://developer.mozilla.org/en-US/docs/Web/API/Element|Dom Element}

### public toString(): string source

Get the string representation of all the children of this YXmlFragment.

#### Return:

string | The string representation of all children.