Easy Tutorial
❮ Event Onplay Dom Obj Pushbutton ❯

HTML DOM Element Object


HTML DOM Nodes

In the HTML DOM (Document Object Model), everything is a node:


Element Object

In the HTML DOM, the element object represents an HTML element.

The child nodes of an element object can be element nodes, text nodes, or comment nodes.

The NodeList object represents a list of nodes, similar to a collection of child nodes of an HTML element.

Elements can have attributes. Attributes are attribute nodes (see the next section).


Browser Support

All major browsers support the element object and NodeList object.


Properties and Methods

The following properties and methods apply to all HTML elements:

Property / Method Description
element.accessKey Sets or returns the accesskey of an element
element.addEventListener() Adds an event handler to the specified element
element.appendChild() Adds a new child node to an element
element.attributes Returns an array of an element's attributes
element.childNodes Returns an array of an element's child nodes
element.children Returns a collection of an element's child elements
element.classList Returns the class name(s) of an element, as a DOMTokenList object
element.className Sets or returns the class attribute of an element
element.clientTop Returns the width of the top border of an element
element.clientLeft Returns the width of the left border of an element
element.clientHeight Returns the inner height of an element, including padding
element.clientWidth Returns the inner width of an element, including padding
element.cloneNode() Clones an element
element.compareDocumentPosition() Compares the document position of two elements
element.contentEditable Sets or returns whether the content of an element is editable
element.dir Sets or returns the text direction of an element
element.firstElementChild Returns the first child element of an element
element.firstChild Returns the first child node of an element
element.focus() Sets focus on the specified element
element.getAttribute() Returns the specified attribute value of an element
element.getAttributeNode() Returns the specified attribute node
element.getElementsByTagName() Returns a collection of all child elements with the specified tag name
element.getElementsByClassName() Returns a NodeList of all child elements with the specified class name
element.getFeature() Returns an object that implements the APIs of a specified feature
element.getUserData() Returns an object associated with a key on an element
element.hasAttribute() Returns true if an element has the specified attribute, otherwise false
element.hasAttributes() Returns true if an element has any attributes, otherwise false
element.hasChildNodes() Returns true if an element has any child nodes, otherwise false
element.hasFocus() Returns a boolean indicating whether the document or any element has focus
element.id Sets or returns the id of an element
element.innerHTML Sets or returns the content of an element
element.insertBefore() Inserts a new child node before an existing child node
element.isContentEditable Returns true if the content of an element is editable, otherwise false
element.isDefaultNamespace() Returns true if the specified namespaceURI is the default, otherwise false
element.isEqualNode() Checks if two elements are equal
element.isSameNode() Checks if two elements are the same node
element.isSupported() Returns true if a specified feature is supported on the element
element.lang Sets or returns the language of an element
element.lastChild Returns the last child node of an element
element.lastElementChild Returns the last child element of an element
element.matches() Returns true if an element matches a specified CSS selector
element.namespaceURI Returns the namespace URI of an element
element.nextSibling Returns the next node at the same node tree level
element.nextElementSibling Returns the next element at the same node tree level
element.nodeName Returns the name of a node (in uppercase)
element.nodeType Returns the node type of a node
element.nodeValue Returns the value of a node
element.normalize() Normalizes the node by merging adjacent text nodes and removing empty text nodes
element.offsetHeight Returns the height of an element, including padding and border
element.offsetWidth Returns the width of an element, including padding and border
element.offsetLeft Returns the horizontal offset position of an element
element.offsetParent Returns the offset container of an element
element.offsetTop Returns the vertical offset position of an element
element.ownerDocument Returns the root element (document object) for an element
element.parentNode Returns the parent node of an element
element.previousSibling Returns the previous node at the same node tree level
element.previousElementSibling Returns the previous element at the same node tree level
element.querySelector() Returns the first child element that matches a specified CSS selector
document.querySelectorAll() Returns a list of all child elements that match the specified CSS selector
element.removeAttribute() Removes the specified attribute from the element
element.removeAttributeNode() Removes the specified attribute node and returns the removed node
element.removeChild() Removes a child element
element.removeEventListener() Removes an event handler added by the addEventListener() method
element.replaceChild() Replaces a child element
element.scrollHeight Returns the entire height of the element, including areas not visible due to overflow
element.scrollLeft Returns the distance between the actual left edge of the element and the left edge of its current view
element.scrollTop Returns the distance between the actual top edge of the element and the top edge of its current view
element.scrollWidth Returns the entire width of the element, including areas not visible due to overflow
element.setAttribute() Sets or changes the specified attribute to the specified value
element.setAttributeNode() Sets or changes the specified attribute node
element.setIdAttribute()
element.setIdAttributeNode()
element.setUserData() Associates an object with a key value in the element
element.style Sets or returns the style attribute of an element
element.tabIndex Sets or returns the tab order of an element
element.tagName Returns the tag name of an element as a string (uppercase)
element.textContent Sets or returns the text content of a node and its descendants
element.title Sets or returns the title attribute of an element
element.toString() Converts an element to a string
nodelist.item() Returns an element based on its index in the document tree
nodelist.length Returns the number of nodes in the node list
❮ Event Onplay Dom Obj Pushbutton ❯