DOM是Document Object Model文档对象模型
一个网页，为一个文档；
网页中每个部分都是节点，常用的节点分为，文档节点，元素节点，属性节点，文本节点；
浏览器已经为我们提供了文档节点对象，这个对象是window属性，可以在页面中直接使用，文档节点代表的是整个页面，document；
———————-
如果需要读取元素节点属性，直接使用元素.属性名，例如元素.id，元素.name，元素.value，等等，唯独class属性时需要使用元素.className;
———————-
在整个页面上找；
document.getElementByTagName(“li”),
在div标签内找；
ul的字节点；
childNodes：获取所有子节点；
ChildNodes:返回结果为9个，包含5个text，4个li；因为上图的黄色涂鸦为text，
如果标签按如下图所写的话，就没有text，返回结果就是4个了；
children：获取所有子元素；
利用children返回的就是4个li了；
firstchild：获取第一个子节点；包括上面情况的text空白；
firstElementChild；获取第一个子元素；
parentNode：父节点
previousSibling：前兄弟节点
previousElementSibling：前兄弟元素
nextSibing；
nextElementSibing；
———————————-
获取body和html标签；
var body = document.body；
var html = document.documentElement;
页面中所有的元素：document.all；
document.getElementsBytagName(‘*’)
————————————
可以根据css选择器来查询一个元素节点对象；
document.querySelect(“.box div”);
document.querySelectAll(‘.box’);
—————————————
Js修改样式，
语法：元素.style.样式名 = 样式值；
backgroud-color需要修改为backgroudColor；
js修改的为内联样式；
获取样式
语法：元素.style.样式名
该方法只能获取内联样式；即嵌套在标签元素的样式；例
获取当前显示的样式；
语法：元素.currentStyle.样式名；
只有IE浏览器支持！！！！
在其他浏览器中可以用；
var box = document.getElementById(‘id’);
var obj = getComputedStyle（box,null）；
获取宽度；
console.log(obj.width);
需要两个参数，第一个，要获取样式的元素，第二个，可以传递一个伪元素，一般都传null；该方法会返回一个对象，对象中封装了一个当前元素的对应的样式；例如：obj.width
上面不支持IE8以下!!!
通过currentStyle和getComputedStyle方法读取到的样式都是只读的，不能修改，修改只能用style属性；
兼容所有浏览器的方法！！