Знакомство с DOM
}{ао, пиплы! Сегодня речь пойдет о DOM.
Что такое DOM?
Все теги в HTML-документе рассматриваются браузером как объекты. Внутри тега могут содержаться другие теги. Такие теги будут являться дочерними. Проще говоря, весь HTML-документ представляет из себя дерево тегов с разными разветвлениями. В целом, это и есть DOM (Document Object Model).
Итак, самая простая страница:
<html>
<head>
<title>Document</title>
</head>
<body>
<p>Текст</p>
<button>Click Me</button>
</body>
</html>Это пример самой простой HTML-страницы. Напомню, что эту разметку нужно сохранить в файл формата .html, чтобы ее мог открыть браузер.
Если внимательно посмотреть на теги, то можно заметить, что внутри одних тегов мы четко видим другие теги.
Внутри тега <html> лежат все остальные теги: <head>, <body>. Внутри же этих тегов, например, <head> лежит тег <title>.
Все, что существует внутри HTML-документа, является частью DOM-дерева.
Если честно, то различных аспектов с DOM достаточно много, но не хочется на них заострять большое внимание, потому как это будет больше теории, нежели практики. А я пытаюсь научить тебя больше практической части.
Если совсем подытожить, то DOM позволяет нам крутить-вертеть всеми элементами нашего HTML-документа. Можем изменить положение элемента, цвет, да почти все что угодно.
Всем этим мы начнем заниматься со следующего урока.