1、什么叫DOM？
文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上，组织页面（或文档）的对象被组织在一个树形结构中，用来表示文档中对象的标准模型就称为DOM。
DOM技术使得用户页面可以动态地变化，如可以动态地显示或隐藏一个元素，改变它们的属性，增加一个元素等，DOM技术使得页面的交互性大大地增强。
DOM定义了表示和修改文档所需的对象、这些对象的行为和属性以及这些对象之间的关系。
２、DOM树
可以把DOM认为是页面上数据和结构的一个树形表示，不过页面当然可能并不是以这种树的方式具体实现
DOM.jpg
DOM.jpg
3、查找获取节点的方法
包括五种方式：
1.按id查找；
2.按标签名查找：var elems = parent.getElementsByTagName('');
3.按name属性查找：要回传给服务器的元素需要name属性，专门找表单中有name属性的表单元素；---了解即可；
4.按class属性查找；
var elems = parent.getElementsByClassName('class名');
（1）.可在任意父元素上调用；
（2），可返回多个元素的组成的集合；
（3），不要求全部匹配，只要包含即可；
缺点：每次只能按一个条件查找，如果条件复杂的话，就无法一句话获得想要的元素；
5，这是重点强调的选择器，按选择器查找：用的比较多，比较犀利。
5.1 只找一个元素：
var elem = parent.querySelector('selector‘);
5.2 找多个元素：
var elems = parent.querySelectorAll（'selector')
那么我们获得了这些元素，就可以对他们更改、添加或删除啦，所以我们说 DOM 是用于获取、更改、添加或删除 XML 元素的标准。
4、DOM节点类型
这里只介绍几个方便我们写代码的节点
childNodes 所有子节点(数组)=换行+注释+所有子标签
children 所有是标签类型的子节点
parentNode 父节点
nextSibling 下一个兄弟节点
previousSibling 上一个兄弟节点
firstChild 第一个子节点
lastChild 最后一个子节点
5、常见的节点操作
（1）创建节点/属性
document.createElement("标签名"); //创建一个标签节点
document.createTextNode("你好"); //创建一个文本节点
(2)插入节点
div.appendChild(newNode);
//在某个div节点的末尾添加一个子节点
// 在XXX之前插入span
redDiv.insertBefore(span,redDiv.children[1]);
(3)删除节点
redDiv.removeChild(addr);
// 移除redDiv的子节点address，address父级调用方法
addr.remove();
//移除address标签，自身调用方法
（4）修改、替换节点
var h2=document.createElement("h2");
h2.innerHTML="泗泾";
h2.style.color="blue";
redDiv.replaceChild(h2,redDiv.children[0]);
