DOM is the core concept every beginner web developer must learn about. This article covers a topic of what is JavaScript HTML DOM.
What is DOM
At a basic level, the Document Object Model (DOM) is an only API that represents a document as a tree structure and allows you to manipulate this document. Every object in DOM represents a particular part of the page document, also called as node. There are family tree relations between nodes. One node can have ancestors, descendants, and siblings. It enables convenient navigation through the node tree.
There are 4 main types of node: element, text, comment and attribute.
JavaScript HTML DOM
DOM’s API provides various methods for retrieving and modifying content of the document. But one cannot do any action without a tool that can use these methods. Here JavaScript comes to help. For a long time, JavaScript is the No. 1 scripting language on the web. JavaScript enables dynamic HTML and provides tools to control nodes:
- set CSS styles, change existing ones;
- select and modify any element on the page;
- retrieve any element and change its content;
- create and remove any element, attribute;
- listen and react to any event on the page;
- and much more!