HTML CSS Bootstrap Javascript Icons Python
JavaScript Reference
Overview
JS Reference
JS Array Object JS Boolean Object JS Date Object JS Style Declaration Object JS Error Object JS Global Object JS Math Object JS Number Object JS String Object JS RegExp Object JS Statements
DOM Reference
DOM Attribute DOM Console DOM Document DOM Element DOM Events DOM Event Objects DOM History DOM HTMLCollection DOM Location DOM Navigator DOM Screen DOM Style DOM Window WEB Storage

HTML DOM Element Object

The Element Object

The Element object represents an HTML element, like <p>, <div>, <a>, <form>, or any other HTML element.

The Element object only has methods and properties common to all kinds of elements.

Element Object Properties

The following table lists the properties of the Element object:

Property Description
accessKey Sets or returns the accesskey attribute of an element
attributes Returns a NamedNodeMap of an element's attributes
childElementCount Returns the number of child elements of the given element
childNodes Returns a list of an element's child nodes (including text and comment nodes)
children Returns a list of an element's child element (excluding text and comment nodes)
classList Returns the class name(s) of an element
className Sets or returns the value of the class attribute of an element
clientHeight Returns the height of an element, including padding
clientLeft Returns the width of the left border of an element
clientTop Returns the width of the top border of an element
clientWidth Returns the width of an element, including padding
contentEditable Sets or returns whether the content of an element is editable or not
dir Sets or returns the value of the dir attribute of an element
firstChild Returns the first child node of an element
firstElementChild Returns the first child element of an element (excluding text and comment nodes)
id Sets or returns the value of the id attribute of an element
innerHTML Sets or returns the content of an element
innerText Sets or returns the text content of an element and its descendants
isContentEditable Returns true if the content of an element is editable, otherwise false
lang Sets or returns the value of the lang attribute of an element
lastChild Returns the last child node of an element
lastElementChild Returns the last child element of an element (excluding text and comment nodes)
namespaceURI Returns the namespace URI of an element
nextSibling Returns the next node at the same node tree level
nextElementSibling Returns the next element at the same node tree level (excluding text and comment nodes)
nodeName Returns the name of a node
nodeType Returns the node type of a node
nodeValue Sets or returns the value of a node
offsetHeight Returns the height of an element, including padding, border and scrollbar
offsetWidth Returns the width of an element, including padding, border and scrollbar
offsetLeft Returns the horizontal offset position of an element
offsetParent Returns the offset container of an element
offsetTop Returns the vertical offset position of an element
ownerDocument Returns the root element (document object) for an element
parentNode Returns the parent node of an element
parentElement Returns the parent element of an element
previousSibling Returns the previous node at the same node tree level
previousElementSibling Returns the previous element at the same node tree level (excluding text and comment nodes)
scrollHeight Returns a Number representing the scroll view height of an element
scrollLeft Sets or returns the number of pixels an element's content is scrolled horizontally
scrollTop Sets or returns the number of pixels an element's content is scrolled vertically
scrollWidth Returns a Number representing the scroll view width of the element
style Sets or returns the value of the style attribute of an element
tabIndex Sets or returns the value of the tabindex attribute of an element
tagName Returns the tag name of an element
textContent Sets or returns the textual content of a node and its descendants
title Sets or returns the value of the title attribute of an element

Element Object Methods

The following table lists the methods of the Element object:

Method Description
addEventListener() Attaches an event handler to the specified element
appendChild() Adds a new child node to an element, as the last child node
blur() Removes focus from an element
cloneNode() Clones an element
click() Simulates a mouse-click on an element
compareDocumentPosition() Compares the document position of two elements
contains() Returns true if a node is a descendant of a node, otherwise false
focus() Gives focus to an element
getAttribute() Returns the specified attribute value of an element node
getAttributeNode() Returns the specified attribute node
getBoundingClientRect() Returns the size of an element and its position relative to the viewport
getElementsByClassName() Returns a list of all child elements with the specified class name
getElementsByTagName() Returns a list of all child elements with the specified tag name
hasAttribute() Returns true if an element has the specified attribute, otherwise false
hasAttributes() Returns true if an element has any attributes, otherwise false
hasChildNodes() Returns true if an element has any child nodes, otherwise false
insertAdjacentElement() Inserts a HTML element at the specified position relative to the current element
insertAdjacentHTML() Inserts a HTML formatted text at the specified position relative to the current element
insertAdjacentText() Inserts text into the specified position relative to the current element
insertBefore() Inserts a new child node before a specified, existing, child node
isDefaultNamespace() Returns true if a specified namespaceURI is the default, otherwise false
isEqualNode() Checks if two elements are equal
isSameNode() Checks if two elements are the same node
isSupported() Returns true if a specified feature is supported on the element
normalize() Joins adjacent text nodes and removes empty text nodes in an element
querySelector() Returns the first child element that matches a specified CSS selector(s) of an element
querySelectorAll() Returns all child elements that matches a specified CSS selector(s) of an element
removeAttribute() Removes a specified attribute from an element
removeAttributeNode() Removes a specified attribute node, and returns the removed node
removeChild() Removes a child node from an element
removeEventListener() Removes an event handler that has been attached with the addEventListener() method
replaceChild() Replaces a child node in an element
requestFullscreen() Shows an element in fullscreen mode
scrollIntoView() Scrolls the specified element into the visible area of the browser window
setAttribute() Sets or changes the specified attribute, to the specified value
setAttributeNode() Sets or changes the specified attribute node
toString() Converts an element to a string