什么是DOM

什么是DOM？
当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model），简称 DOM。DOM 模型被结构化为对象树，又称 DOM 树

DOM的结构
DOM 实际上是以面向对象方式描述的对象模型，它将文档建模为一个个对象，以树状的结构组织（本文称之为“文档树”，树中的对象称为“节点”

整个文档是一个文档节点

每个 HTML 标签是一个元素节点

包含在 HTML 元素中的文本是文本节点每一个 HTML 属性是一个属性节点

注释属于注释节点

DOM的作用
通过可编程的对象模型，JavaScript 获得了足够的能力来动态操作 HTML

DOM提供的获取元素的方法（常见）

document.getElementById(‘id’)：通过元素 id 来查找元素
document.getElementsByTagName(‘name’)：通过标签名来查找元素
document.getElementsByClassName(‘class’)：通过类名来查找元素
document.getElementsByName(‘name’)：通过表单元素中 name 名查找元素
document.querySelector(‘CSS 选择器’)：通过 CSS 选择器获取匹配上的第一个元素
document.querySelectorAll(‘CSS 选择器’)：通过 CSS 选择器获取匹配上的所有元素
子元素.parentElement：用于获取当前元素的父元素
父元素.children：用于获取当前元素的子元素
当前元素.nextElementSibling：用于获取当前元素的下一个同级元素