HTMLElement

The HTMLElement interface represents any HTML element. Some elements directly implement this interface, others implement it via an interface that inherits it.

  <div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25  121,20  121,30  111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/Node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="188.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Node</text></a><polyline points="226,25  236,20  236,30  226,25" stroke="#D4DDE4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/Element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="303.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Element</text></a><polyline points="341,25  351,20  351,30  341,25" stroke="#D4DDE4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text  x="436" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">HTMLElement</text></a></svg></div>

  a:hover text { fill: #0095DD; pointer-events: all;}

Properties

Inherits properties from its parent, Element, and implements those from GlobalEventHandlers and TouchEventHandlers.

HTMLElement.accessKey

Is a DOMString representing the access key assigned to the element.

HTMLElement.accessKeyLabel Read only

Returns a DOMString containing the element's assigned access key.

HTMLElement.contentEditable

Is a DOMString, where a value of "true" means the element is editable and a value of "false" means it isn't.

HTMLElement.isContentEditable Read only

Returns a Boolean that indicates whether or not the content of the element can be edited.

HTMLElement.contextMenu

Is a HTMLMenuElement representing the contextual menu associated with the element. It may be null.

HTMLElement.dataset Read only

Returns a DOMStringMap with which script can read and write the element's custom data attributes (data-*) .

HTMLElement.dir

Is a DOMString, reflecting the dir global attribute, representing the directionality of the element. Possible values are "ltr", "rtl", and "auto".

HTMLElement.draggable

Is a Boolean indicating if the element can be dragged.

HTMLElement.dropzone Read only

Returns a DOMSettableTokenList reflecting the dropzone global attribute and describing the behavior of the element regarding a drop operation.

HTMLElement.hidden

Is a Boolean indicating if the element is hidden or not.

HTMLElement.inert

Is a Boolean indicating whether the user agent must act as though the given node is absent for the purposes of user interaction events, in-page text searches ("find in page"), and text selection.

HTMLElement.itemScope

Is a Boolean representing the item scope.

HTMLElement.itemType Read only

Returns a DOMSettableTokenList…

HTMLElement.itemId

Is a DOMString representing the item ID.

HTMLElement.itemRef Read only

Returns a DOMSettableTokenList…

HTMLElement.itemProp Read only

Returns a DOMSettableTokenList…

HTMLElement.itemValue

Returns a Object representing the item value.

HTMLElement.lang

Is a DOMString representing the language of an element's attributes, text, and element contents.

HTMLElement.noModule

Is a Boolean indicating wether an import script can be executed in user agents that support module scripts.

HTMLElement.nonce

Returns the cryptographic number used once that is used by Content Security Policy to determine whether a given fetch will be allowed to proceed.

HTMLElement.offsetHeight Read only

Returns a double containing the height of an element, relative to the layout.

HTMLElement.offsetLeftRead only

Returns a double, the distance from this element's left border to its offsetParent's left border.

HTMLElement.offsetParentRead only

Returns a Element that is the element from which all offset calculations are currently computed.

HTMLElement.offsetTopRead only

Returns a double, the distance from this element's top border to its offsetParent's top border.

HTMLElement.offsetWidthRead only

Returns a double containing the width of an element, relative to the layout.

HTMLElement.properties Read only

Returns a HTMLPropertiesCollection…

HTMLElement.spellcheck

Is a Boolean that controls spell-checking. It is present on all HTML elements, though it doesn't have an effect on all of them.

HTMLElement.style

Is a CSSStyleDeclaration, an object representing the declarations of an element's style attributes.

HTMLElement.tabIndex

Is a long representing the position of the element in the tabbing order.

HTMLElement.title

Is a DOMString containing the text that appears in a popup box when mouse is over the element.

HTMLElement.translate

Is a Boolean representing the translation.

Event handlers

Most event handler properties, of the form onXYZ, are defined on the GlobalEventHandlers or TouchEventHandlers interfaces and implemented by HTMLElement. In addition, the following handlers are specific to HTMLElement.

HTMLElement.oncopy 

Returns the event handling code for the copy event (bug 280959).

HTMLElement.oncut 

Returns the event handling code for the cut event (bug 280959).

HTMLElement.onpaste

Returns the event handling code for the paste event (bug 280959).

TouchEventHandlers.ontouchstart

Returns the event handling code for the touchstart event.

TouchEventHandlers.ontouchend

Returns the event handling code for the touchend event.

TouchEventHandlers.ontouchmove

Returns the event handling code for the touchmove event.

TouchEventHandlers.ontouchenter

Returns the event handling code for the touchenter event.

TouchEventHandlers.ontouchleave

Returns the event handling code for the touchleave event.

TouchEventHandlers.ontouchcancel

Returns the event handling code for the touchcancel event.

Methods

Inherits methods from its parent, Element.

HTMLElement.blur()

Removes keyboard focus from the currently focused element.

HTMLElement.click()

Sends a mouse click event to the element.

HTMLElement.focus()

Makes the element the current keyboard focus.

HTMLElement.forceSpellCheck()

Runs the spell checker on the element's contents.

Specifications

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

See also

• Element