1，概念：文档对象模型，一份html文档就是一个Dom对象
2，节点：文档中的内容，包括标签，文本，注释，标签属性等。其属性有nodeType\nodeName\nodeValue;
节点关系：父子关系childNodes和兄弟关系
种类：元素节点，文本节点，属性节点
使用nodetype获取节点类型，返回值1：元素；2属性；3文本；8注释；9文档
document节点：整个文档的节点
3 文档的写入：
document.write()参数是一个字符串。包括标签字符串
document.writeln()写完后面会有一个空格
这两个方法如果在页面加载完毕时调用，会覆盖之前加载进来的元素
4 查找元素
getElementById()参数为标签的id字符串，把匹配的id值标签返回出来
var div=document.getElementById('id名');
getElementByTagName()通过标签名获取标签，只要文档中有这个标签就会获取到
返回值是一个和数组类型相似的集合。可以利用访问数组元素的方法来访问集合中的标签
var li=document.getElementByTagName('li')
getElementsByClassName()通过class属性值获取标签参数和返回值情况与tagname不是w3c协议中的方法，存在兼容问题
getElementByName('name值')获取name属性的值获取标签，该方法一般用来获取表单元素时使用
getArributeNode()获取元素属性获取到参数指定的节点var attr=div.getAttributeNode('class');
setArributeNode()设置元素中的属性值
getAttribute:获取到的参数指定的属性的值
使用attributes属性获取到标签中的全部属性。使用[]括号包裹属性字符串就可以得到指定属性的值
console.log(ul[0].tagName);
5 标签元素的属性
tagname获取元素节点的标签名
innerHTML获取赋值。不仅可以获取到当前标签内部的文本，还可以拿到内部嵌套的子标签
不仅可以给当前标签设置文本，还可以设置子标签，且子标签能被解析
innerText只能获取到当前标签内部的文本，如果有子标签获取不到
只能设置当前标签文本，若想设置子标签，则子标签会被当做普通文本原样输出
6 脚本化CSS： 使用js设置获取标签的样式，只能获取获取到设置行内的样式，如果标签样式是设置在头部，外部样式表中，使用标签的style属性无法获取到
使用js操作标签样式的套路：
标签.style.样式属性名
7 节点的遍历
childNodes获取当前元素的所有子节点
firstChild获取当前元素第一个子节点
lastChild获取当前元素最后一个子节点
ownerDocument获取当前节点的根节点
parentNote获取当前元素的父节点
previousSibling获取当前节点的前一个同级节点
8 使用js修改css
获取当前标签左侧的距离:offsetLeft
9 标签节点的操作方法
创建一个新标签
var img=document.createElement('img');
把标签拼接进文档流
div.appendChild(img);
div.insertBefore(p,document.getElementById('p3'));
设置内容
p.innerHTML='我是插班';
替换节点
div.replaceChild(p,document.getElementById('p3'));
移除节点
document.getElementById('p1').remove();