Вы, наверное, знаете, что такое DOM, но знаете ли вы спецификацию?
Javascript теперь больше язык только для Интернета. Он может работать независимо на многих платформах, будь то веб-браузер, сервер или любая другая хост-среда.
Хост-среда в дополнение к базовой языковой конструкции предоставляет свои собственные объекты и функции. Эти объекты, предоставляющие переменные и функции, доступные где угодно, называются глобальными объектами и по умолчанию встроены в язык или среду. Если среда представляет собой веб-браузер, то этот глобальный объект является окном. В Node.js это называется глобальным. Недавно в язык было добавлено globalThis в качестве стандартного имени для ссылки на глобальный объект, и оно поддерживается на разных платформах.
Объектная модель браузера (BOM)
Популярность и мощь JavaScript обусловлены тем фактом, что они могут получать доступ к объектам, присущим среде браузера, и манипулировать ими. Если вы знаете, что такое DOM, BOM представляет собой аналогичную древовидную структуру, которая представляет собой набор объектов, которые позволяют нам взаимодействовать с браузером пользователя с помощью различных методов и свойств.
WINDOW «корневой» объект
Объект в «корне» веб-браузера — это window. Он представляет свойства текущего открытого «окна браузера» и является глобальным объектом для JavaScript, работающего в веб-браузере. Даже document и screen являются свойствами объекта окна.
Примечание. Каждая вкладка браузера имеет собственный объект окна.
Объект window имеет ряд свойств и методов, и поскольку это глобальный объект, доступ к ним возможен напрямую.
Чтобы узнать больше об этих свойствах и методах, обратитесь к документации MDN или просто откройте инструменты разработчика браузера, введите окно консоли и нажмите Enter. Вы увидите все методы и свойства объекта окна.
Объект документа
Объект document является потомком объекта window и представляет содержимое вашей веб-страницы. Объект документа — это то, что позволяет JavaScript изменять дерево DOM, т. е. если мы хотим манипулировать каким-либо содержимым HTML или XML на веб-странице или если мы хотим ввести новые элементы на веб-страницу, мы для этого используйте объект документа и его свойства.
Самый простой пример, свидетелями которого были многие из нас, — это document.getElementById(‘some id’). Используя этот метод, мы могли легко манипулировать содержимым элемента с определенным идентификатором.
Чтобы узнать больше о манипулировании DOM, посетите ресурс W3Schools.
document и windowobject хотя и имеют некоторые перекрывающиеся имена для методов и свойств, но их поведение различно. Самый простой пример — это window.open(), который откроет новую пустую вкладку, document.open() создаст пустой документ в том же окне.
Объект экрана
Объект экранаявляется частью спецификации, но является еще одним свойством объекта окна. Объект экрана представляет информацию, характерную для экрана пользователя, такую как высота просмотра экрана, его ширина, глубина в пикселях и т. д. Объект экрана имеет ограниченные свойства и методы, см. Документацию MDN, чтобы узнать более.