Elements

DOM element creation and queries.

Access:

app.getService('elements')

App code:

const elements = app.getService('elements');

Plugin:

const elements = this.app.getService('elements');

is#

Dispatches to a type-specific element check (text, element, inline, block, heading, list, dataBlock, etc.).

Parameters:

• node (HTMLElement | string) — DOM node
• type (string) — block or entity type name

Returns: boolean

elements.is(node, 'inline');

isText#

Returns whether the node is a text node (nodeType === Node.TEXT_NODE).

Parameters:

• node (HTMLElement | string) — DOM node

Returns: boolean

elements.isText(node);

isElement#

Returns whether the node is an element node (nodeType === Node.ELEMENT_NODE).

Parameters:

• node (HTMLElement | string) — DOM node

Returns: boolean

elements.isElement(node);

isInline#

Returns whether the element tag is in the editor tags.inline configuration set.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isInline(el);

isBlock#

Returns whether the element tag is in the editor tags.block configuration set.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isBlock(el);

isInlineOrBlock#

Returns true when the element is classified as either an inline or block tag by editor options.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isInlineOrBlock(el);

isHeading#

Returns whether the element is an H1–H6 heading tag.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isHeading(el);

isList#

Returns whether the element is a UL or OL list tag.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isList(el);

isTopLevelBlock#

Returns whether the element is a direct child of the editor editable root.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isTopLevelBlock(el);

isDataBlock#

Returns whether the element has a data-block attribute marking it as a Redactor block.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isDataBlock(el);

getDataBlockType#

Returns the data-block type string from the element, or null when the element is not a data block.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: string|null

elements.getDataBlockType(el);

isDataBlockType#

Returns whether the element is a data block with the specified block type.

Parameters:

• el (HTMLElement | string) — DOM element
• type (string) — block or entity type name

Returns: boolean

elements.isDataBlockType(el, 'image');

isInlineDataBlock#

Returns whether the data block is registered as an inline block type via blockManager metadata.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isInlineDataBlock(el);

isDataBlockNoInline#

Returns whether the element is a data block that is not classified as inline.

Parameters:

• el (HTMLElement | string) — DOM element

Returns: boolean

elements.isDataBlockNoInline(el);

isTag#

Returns whether the element tag name matches the given tag (case-insensitive).

Parameters:

• el (HTMLElement | string) — DOM element
• tag (string) — target tag name

Returns: boolean

elements.isTag(el, 'p');

isToolLayer#

Returns whether the node or its ancestor is inside a .rx-tool UI layer element.

Parameters:

• node (HTMLElement | string) — DOM node

Returns: boolean

elements.isToolLayer(node);

isEmpty#

Checks whether a node has no meaningful content, with optional removal of br tags, invisible characters, and whitespace.

Parameters:

• node (HTMLElement | string) — DOM node
• options (object) — object with the keys below
  • removeSpaces (any) — treat runs of whitespace/  as empty content (default true)
  • removeInvisible (any) — strip invisible marker/zero-width characters before checking (default true)
  • removeBr (any) — treat a lone <br> as empty content (default true)

Returns: boolean

elements.isEmpty(el, { removeBr: true });

isElementVisibleInScroll#

Returns whether the element bounding rect is fully within the editor container visible scroll area.

Parameters:

• element (HTMLElement | string) — element

Returns: boolean

elements.isElementVisibleInScroll(el);

cloneAttributes#

Copies all attributes from one element to another, skipping names in the exclude list.

Parameters:

• fromEl (HTMLElement | string) — source DOM element
• toEl (HTMLElement | string) — destination DOM element
• exclude (Array) — attribute or class names to skip

Returns: HTMLElement

elements.cloneAttributes(fromEl, toEl, ['id']);

removeAttributes#

Removes all attributes from an element except those listed in exclude.

Parameters:

• el (HTMLElement | string) — DOM element
• exclude (Array) — attribute or class names to skip

Returns: HTMLElement

elements.removeAttributes(el, ['data-block']);

replaceTag#

Replaces an element with a new tag of the given name, optionally cloning attributes and moving child nodes.

Parameters:

• el (HTMLElement | string) — DOM element
• tag (string) — target tag name
• cloneAttrs (boolean) — copy attributes from the source element onto the replacement

Returns: HTMLElement|null

elements.replaceTag(el, 'h2');

getInlineElements#

Walks up from a node to collect the chain of inline ancestor elements between the node and the editor root.

Parameters:

• node (HTMLElement | string) — DOM node

Returns: { elements: HTMLElement[], bottom: HTMLElement|null, top: HTMLElement|null }

elements.getInlineElements(node);

getTopLevelBlock#

Returns the nearest ancestor element that is a direct child of the editor editable root.

Parameters:

• node (HTMLElement | string) — DOM node

Returns: HTMLElement|null

elements.getTopLevelBlock(node);

getDataBlock#

Walks up from a node to find the nearest ancestor with a data-block attribute, optionally filtering by block type.

Parameters:

• node (HTMLElement | string) — DOM node
• type (string) — block or entity type name

Returns: HTMLElement|null

elements.getDataBlock(node, 'list');