## 前言 通过本文你将获取与浏览器dom相关的对象的知识，这里只列举了常用的部分，因为常见的jq框架封装了对应的方法，而在新兴的三大框架之中，也有各自的实践和设计思路，但有些时候你还是需要知道一些基本的dom-api语法的。 ## 基本语法 ### 获取属性 - node.attributes 会返回所有属性值的集合（数组形式），所有的主流浏览器都可以使用，在ie8以及更早的浏览器中是返回所有的可能属性的集合。 - getAttribute() 获取指定属性 - hasAttribute() 是否具有某具体属性 ### 类列表以及api node.classList,返回元素的类名对象，具有自己完善的增删方法，建议必须掌握。 | 名称 | 作用 | | --- | --- | | add(class1,class2） | 增加某些类，如果类已经存在不再添加 | | contains(class) |返回是否具有某类，返回布尔型，有true，没有false | | item(index) |返回指定index的class名，参数必填 | | remove(class1,class2) | 移除某些类，移除不存在的类不会报错 | | toggle(class,true|false) | 切换某类，移除返回false，添加返回true;第二个参数代表强制删除或者添加，true代表添加，false代表删除 | ### 节点操作 - 添加子节点 appendChild() - 子节点数组 childNodes() ### 位置相关 元素的滚动高度与容器高度的距离一般用于加和用作滚动到页面的最顶部 - scrollTop 元素的顶部与页面顶部的距离,如果当前对象是window代表的是页面的滚动高度 - offsetTop 元素的顶部与容器顶部的距离 - scrollHeight 返回整个元素的高度 包括滚动条的 ### 其他 其他不常见的不做要求，这里只是强烈建议大家把里面针对样式的，属性操作的部分了解到。 ## 参考资料 * [菜鸟教程-关于浏览器原生dom对象](http://www.runoob.com/jsref/dom-obj-all.html)