HTML DOM Methods

HTML DOM methods are actions that we can perform on nodes (HTML elements).

HTML DOM properties are values that we can set and 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 (such as adding or modifying elements).

Properties are values you can get or set (such as the name or content of a node).

getElementById() Method

The getElementById() method returns the element with the specified ID:

Example

var element = document.getElementById("intro");

HTML DOM Objects - Methods and Properties

Some commonly used HTML DOM methods:

• getElementById(id) - Retrieves the node (element) with the specified id.
• appendChild(node) - Inserts a new child node (element).
• removeChild(node) - Deletes a child node (element).

Some commonly used HTML DOM properties:

• innerHTML - The text value of a node (element).
• parentNode - The parent node of a node (element).
• childNodes - The child nodes of a node (element).
• attributes - The attribute nodes of a 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 include eat(), sleep(), work(), play(), etc.

Everyone has these methods, but they are performed at different times.

A person's properties include name, height, weight, age, gender, etc.

Everyone has these properties, but their values vary from person to person.

Some DOM Object Methods

Here are some commonly used methods that you will learn in this tutorial: