YouTip LogoYouTip

Htmldom Methods

# HTML DOM Methods * * * HTML DOM methods are actions we can perform on nodes (HTML elements). HTML DOM properties are values we can set or modify on nodes (HTML elements). * * * ## Programming Interface The HTML DOM can be accessed via JavaScript (and other programming languages). All HTML elements are defined as objects, and the programming interface consists of object methods and object properties. Methods are actions you can perform (like adding or modifying elements). Properties are values you can get or set (like the name or content of a node). * * * ## The getElementById() Method The getElementById() method returns the element with the specified ID: ## Example var element=document.getElementById("intro"); [Try it Β»](#) * * * ## HTML DOM Objects - Methods and Properties Some commonly used HTML DOM methods: * getElementById(id) - gets the node (element) with the specified id * appendChild(node) - inserts a new child node (element) * removeChild(node) - removes a child node (element) Some commonly used HTML DOM properties: * innerHTML - the text value of the node (element) * parentNode - the parent node of the node (element) * childNodes - the child nodes of the node (element) * attributes - the attribute nodes of the node (element) You will learn more about properties in the next chapter of this tutorial. * * * ## Real-life Objects A person is an object. A person's methods might be eat(), sleep(), work(), play(), etc. Everyone has these methods, but they perform them at different times. A person's properties include name, height, weight, age, gender, etc. Everyone has these properties, but their values differ from person to person. * * * ## Some DOM Object Methods Here are some commonly used methods you will learn in this tutorial: | Method | Description | | --- | --- | | getElementById() | Returns the element with the specified ID. | | getElementsByTagName() | Returns a NodeList (collection/array of nodes) containing all elements with the specified tag name. | | getElementsByClassName() | Returns a NodeList containing all elements with the specified class name. | | appendChild() | Adds a new child node to the specified node. | | removeChild() | Removes a child node. | | replaceChild() | Replaces a child node. | | insertBefore() | Inserts a new child node before a specified child node. | | createAttribute() | Creates an attribute node. | | createElement() | Creates an element node. | | createTextNode() | Creates a text node. | | getAttribute() | Returns the specified attribute value. | | setAttribute() | Sets or modifies the specified attribute to the specified value. |
← Htmldom PropertiesHtmldom Nodes β†’