## 前言 通過本文你將獲取與瀏覽器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)