HTML DOM API

Application Programming Interface

The DOM API (Application Programming Interface) is a set of Methods and Properties that allow JavaScript to change the content, structure, and style of any HTML elements.

An API Method is an Action that you can do on an HTML element.

An API Property is a Value that you can access on an HTML element

• document is the HTML document.
• getElementById() is a document method.
• myPara = getElementById("demo") retrieves the "demo" element.
• innerHTML is an element property.
• myPara.innerHTML = "Hello World!" changes the property.

HTML DOM API Abilities

The DOM API provides us with the ability to:

• Find and select elements
• Change element content and attributes
• Add, remove, or modify elements
• Change CSS styles
• Add event listeners to react to user input

JavaScript is the Language

The DOM API is a standard for how to get, change, add, or delete HTML DOM elements.

JavaScript is the language used in browsers to access the DOM through the API.

API Methods and Properties
Developers use global objects like document and window as entry points to any API.

If you want to access any element in an HTML page, you always start with accessing the document object. The document object represents your web page.

To manipulate HTML with JavaScript, you first need to select an element.

Below are some examples of how you can use the document object to access HTML:

Accessing Element Content

Accessing Element Attributes

Changing Element Attributes