Skip to navigation

element.getTag()

Retrieve the HTML tag of an element.

Syntax

element.getTag(): Promise<null | BlockElementTag | HeadingTag | ListTag | string>

This method also returns the binding metadata for Heading elements:

// Heading elements only — returns binding metadata when tag is bound to a CMS field
element.getTag(options: { bindings: true }): Promise<HeadingTag | BindingValue | null>

Returns

The return type depends on the element type:

Element typeReturn typeValid tag values
Block, Section, VFlex, HFlex, Container, Row, Column, BlockContainer, RichText, Slot, NavbarContainer, TabsContentBlockElementTag | nulldiv, header, footer, nav, main, section, article, aside, address, figure
HeadingHeadingTag | nullh1, h2, h3, h4, h5, h6
ListListTag | nullul, ol
DOMstring | nullAny valid custom tag name

Returns null if the element is not found or the tag is not set.

The element type doesn't tell you the HTML tag

Box elements have the element type Block, the same type as a Div Block. A Block element can use any of the tags in the table above, so check element.type to narrow the type, then call getTag() to read the tag. Other layout types, such as Section, Container, Row, and VFlex, can still appear in existing content. The deprecated Grid, Row, HFlex, VFlex, and BlockContainer presets also still create elements of their own types. Grid elements don’t have a getTag() method.

Example

const el = await webflow.getSelectedElement();
if (el?.type === 'Block') {
const tag = await el.getTag(); // BlockElementTag | null
console.log(tag); // e.g. 'section'
}
if (el?.type === 'Heading') {
const tag = await el.getTag(); // HeadingTag | null
console.log(tag); // e.g. 'h2'
}
if (el?.type === 'List') {
const tag = await el.getTag(); // ListTag | null
console.log(tag); // 'ul' or 'ol'
}

Designer Ability

Designer AbilityLocaleBranchWorkflowSitemode
canAccessCanvasAnyAnyAnyAny