44 lines
1.8 KiB
Markdown
44 lines
1.8 KiB
Markdown
|
---
|
|||
|
title: HTML Dom
|
|||
|
localeTitle: HTML Dom
|
|||
|
---
|
|||
|
## HTML Dom
|
|||
|
|
|||
|
С HTML DOM JavaScript может получить доступ и изменить все элементы HTML-документа.
|
|||
|
|
|||
|
Когда веб-страница загружается, браузер создает **D** ocument **O** bject **M** odel на странице.
|
|||
|
|
|||
|
Модель HTML DOM построена как дерево объектов:
|
|||
|
|
|||
|
Каждый элемент в DOM также называется узлом.
|
|||
|
|
|||
|
```html
|
|||
|
|
|||
|
<html>
|
|||
|
<head>
|
|||
|
<title> My title </title>
|
|||
|
</head>
|
|||
|
<body>
|
|||
|
<a href="#">My Link</a>
|
|||
|
<h1> My header </h1>
|
|||
|
</body>
|
|||
|
</html>
|
|||
|
```
|
|||
|
|
|||
|
DOM для вышеуказанного HTML выглядит следующим образом:
|
|||
|
|
|||
|
![Дерево DOM](https://www.w3schools.com/js/pic_htmltree.gif)
|
|||
|
|
|||
|
С объектной моделью JavaScript получает все необходимое для создания динамического HTML:
|
|||
|
|
|||
|
* JavaScript может изменять все элементы HTML на странице
|
|||
|
* JavaScript может изменить все атрибуты HTML на странице
|
|||
|
* JavaScript может изменять все стили CSS на странице
|
|||
|
* JavaScript может удалить существующие элементы и атрибуты HTML
|
|||
|
* JavaScript может добавлять новые HTML-элементы и атрибуты
|
|||
|
* JavaScript может реагировать на все существующие HTML-события на странице
|
|||
|
* JavaScript может создавать новые HTML-события на странице
|
|||
|
|
|||
|
#### Дополнительная информация:
|
|||
|
|
|||
|
[W3C - HTML DOM](https://www.w3schools.com/js/js_htmldom.asp)
|