DOM, BOM and other browser tools overview
JS nowdays is powerfull enough and it can be used not only by browsers, but also by web-servers and different types of devices(aka IoT devices). Each of this host environments provides JS some tools to maintain platform-specific functionality. This article is a quick look of what kind of instruments web browsers provides to JS.
There is a "root" element inside each browser that's called window. It is a global object for JS code and it provides methods to contol browser window.
DOM
Document Object Model, or DOM for short is a browser tool, that gives developer access to the page elements. DOM represents all page content as objects (DOM nodes) that can be modified.
DOM provides tools to
- "walk" through the document (elem.parentNode, elem.childNodes, etc.)
- search throught the document (elem.querySelector, document.getElementById, elem.getElementsByTagName, etc.)
- modify document (document.createElement, node.append, node.remove, etc.)
BOM
BOM stands for Browser Object Model and represents objects provided by browser (navigator, location, etc.) and basic functions for interaction (alert, confirm, prompt, setTimeout, etc.)