Latest web development tutorials

HTML DOM element object

HTML DOM node

HTML DOM (Document Object Model) in each node things are:

  • The document itself is a document object
  • All HTML elements are an element node
  • All HTML attributes are attribute nodes
  • HTML elements are inserted into the text of the text node
  • Comments are comment nodes

Element object

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

Children of the element objects may be, can be an element node, text nodes, comment nodes.

NodeList object represents a node list, similar to the HTML element child nodes collection.

Elements can have attributes. Property belonging to attribute node (see the next section).


Browser Support

Internet ExplorerFirefoxOperaGoogle ChromeSafari

All major browsers support element object and NodeList object. .


Properties and Methods

The above properties and methods that apply to all HTML elements:

Property / Method description
element .accessKey Sets or returns an element accesskey
element .addEventListener () Add an event handler to a specified element
element .appendChild () Adding a new element to the child element
element .attributes It returns an array of attributes of an element
element .childNodes Returns an array of elements in a child node
element .classlist Returns the class name of the element, as DOMTokenList object.
element .className Sets or returns the class attribute of the element
element .clientHeight Returns the content on the page visible height (not including borders, margins, or scrollbars)
element .clientWidth Returns the contents of the page visible in width (not including borders, margins, or scrollbars)
element .cloneNode () Cloning an element
element .compareDocumentPosition () Document Location to compare two elements.
element .contentEditable Sets or returns whether the element's content editable
element .dir Sets or returns an element in the direction of the text
element .firstChild Returns the element's first child
element .focus () Set document or element gain focus
element .getAttribute () Returns the specified element's attribute values
element .getAttributeNode () Returns the specified attribute node
element .getElementsByTagName () Returns the tag name of a collection of all child elements.
element. getElementsByClassName () Returns all elements in the document specify the class name of the collection, as NodeList object.
element .getFeature () Returns the specified characteristics of the object to perform APIs.
element .getUserData () Return an object associated with the key element.
element .hasAttribute () If the specified property exists element returns true, otherwise it returns false.
element .hasAttributes () If there is any element property returns true, otherwise it returns false.
element .hasChildNodes () Returns whether an element has any children element
element .hasfocus () Returns a Boolean value, detecting whether the document or element gain focus
element .id Sets or returns id of the element.
element .innerHTML Sets or returns the contents of the element.
element .insertBefore () Insert a new child element before the existing child element
element .isContentEditable If the element content editable returns true, false otherwise
element .isDefaultNamespace () If the namespaceURI returns true, otherwise it returns false.
element .isEqualNode () Check the two elements are equal
element .isSameNode () Check the two elements all have the same node.
element .isSupported () If supported features specified in the element returns true.
element .lang Sets or returns the language of an element.
element .lastChild Last child element returned
element .namespaceURI Returns the URI namespace.
element .nextSibling Followed by a return of that element
element .nodeName Returns the tag name of the element (uppercase)
element .nodeType Returns the node type of element
element .nodeValue Returns the value of the element node
element .normalize () So this has become a "normal" form where only structure (eg, elements, comments, processing instructions, CDATA sections, and entity references) spaced Text nodes, ie, the elements (including property) all text nodes below, are neither adjacent text nodes nor empty text nodes
element .offsetHeight Return an element of any height, including the border and filling, but not the margin
element .offsetWidth Returns the width of the element, including borders and padding, but not margins
element .offsetLeft Returns the current element of a relative horizontal offset position offset container
element .offsetParent Returns the offset container element
element .offsetTop Returns the current element relative vertical offset of offset container
element .ownerDocument Returns the element of the root element (document object)
element .parentNode Returns the parent node of an element
element .previousSibling Returns an element immediately preceding element
element .querySelector () Return match the specified CSS selector element is the first child element
document.querySelectorAll () Returns the specified CSS selector matches the element node list of all the sub-elements
element .removeAttribute () Removes the specified attribute from the element
element .removeAttributeNode () Removes the specified attribute node and returns the node removal after.
element .removeChild () To delete a sub-element
element .removeEventListener () Remove the handle by the addEventListener () method to add an event
element .replaceChild () Replace a child element
element .scrollHeight Returns the height of the entire element (including with hidden place of the scroll bar)
element .scrollLeft Returns from the current view of the actual elements of the left edge and the left edge
element .scrollTop Back from the top edge and a top view of the actual elements of the edge between the current
element .scrollWidth Returns the element's entire width (including with hidden place of the scroll bar)
element .setAttribute () Set or change the specified properties and the specified value.
element .setAttributeNode () Set or change the specified attribute node.
element .setIdAttribute ()
element .setIdAttributeNode ()
element .setUserData () In the element associated with the specified key object.
element .style Sets or returns the style attribute of the element
element .tabIndex Sets or returns the tab order of the elements.
element .tagName As a string tag name of an element (uppercase)
element .textContent Sets or returns a node and its text content
element .title Sets or returns the title attribute of the element
element .toString () An element into a string
nodelist .item () Returns the index of an element in the document tree based
nodelist .length Returns the number of nodes in the node list.