HTML DOM (文档对象模型)
当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）。主要目的就是把网页里面的元素当成对象一样支配
HTML DOM 定义了用于 HTML 的一系列标准的对象，以及访问和处理 HTML 文档的标准方法。通过 DOM，你可以访问所有的 HTML 元素，连同它们所包含的文本和属性。
HTML DOM 独立于平台和编程语言。它可被任何编程语言诸如 Java、JavaScript 和 VBScript 使用
- 如何改变 HTML 元素的内容 (innerHTML)
- 如何改变 HTML 元素的样式 (CSS)
- 如何对 HTML DOM 事件做出反应
- 如何添加或删除 HTML 元素
通过JS获取页面元素
-
通过id去获取页面的元素
document.getElementById("div1")
通过这种方式去获取到的，永远都只有可以是0个或1个，不可能是多个
-
通过标签去获取页面元素
document.getElementsByTagName("div"); var t=document.getElementsByTagName("title"); t[0].innerText="标哥哥改变了你的标题";通过这种方法得到的也是一个HTMLCollection，里面是通过某一个标签名来得到的元素集合
-
通过name属性去获取页面元素
document.getElementsByName("sex");
通过上面的方法，可以按照name的名称去获取页面上面的元素，它返回的是一个
NodeList的集合，具备数组的特性（通过索引取值，具备length属性），但是不具备数组的方法（push,pop等方法）,这个集合里面存放的就是我们通过name的名称得到的元素 -
通过选择器去拿，但只拿一个
document.querySelector(css选择器);
如果根据选择器找到了元素，那就返回第一个，如果没有找到，则返回空
-
通过选择器去拿，但是返回多个
document.querySelectorAll(css选择器);
根据CSS选择器，在页面查找匹配，返回所有的匹配项，最终的返回值是一个NodeList
注意事项：上面的第五个和第六个方法是HTML5里面扩展的方法，它可以根据CSS的选择器快速选择页面上面的元素，同时也支持伪类，但是不支持::before/::after
