文檔對象模型 (DOM) 是?HTML?和?XML?文檔的編程接口排吴。它提供了對文檔的結(jié)構(gòu)化的表述蚀浆，并定義了一種方式可以使從程序中對該結(jié)構(gòu)進行訪問智厌，從而改變文檔的結(jié)構(gòu)陈哑，樣式和內(nèi)容妻坝。
常見的操作包括創(chuàng)建節(jié)點、查詢節(jié)點惊窖、更新節(jié)點刽宪、添加節(jié)點、刪除節(jié)點爬坑。
1纠屋、創(chuàng)建節(jié)點
createElement 創(chuàng)建新元素，接受一個參數(shù)盾计，即要創(chuàng)建元素的標簽名售担。
createTextNode 創(chuàng)建一個文本節(jié)點。
createDocumentFragment用來創(chuàng)建一個文檔碎片署辉，它表示一種輕量級的文檔族铆，主要是用來存儲臨時節(jié)點，然后把文檔碎片的內(nèi)容一次性添加到DOM中哭尝。當請求把一個DocumentFragment?節(jié)點插入文檔樹時哥攘，插入的不是?DocumentFragment自身，而是它的所有子孫節(jié)點材鹦。
2逝淹、獲取節(jié)點
querySelector 傳入任何有效的css?選擇器，即可選中單個?DOM元素（首個）桶唐。如果頁面上沒有指定的元素時栅葡，返回?null。
querySelectorAll 返回一個包含節(jié)點子樹內(nèi)所有與之相匹配的Element節(jié)點列表尤泽，如果沒有相匹配的欣簇，則返回一個空節(jié)點列表。需要注意的是坯约，該方法返回的是一個?NodeList的靜態(tài)實例熊咽，它是一個靜態(tài)的“快照”，而非“實時”的查詢（相關(guān)知識點可參考https://blog.csdn.net/cc18868876837/article/details/83508942）闹丐。
其他關(guān)于DOM的方法如下：
每個DOM元素還有parentNode横殴、childNodes、firstChild卿拴、lastChild滥玷、nextSibling、previousSibling屬性巍棱。
3惑畴、更新節(jié)點
innerHTML 不但可以修改一個DOM節(jié)點的文本內(nèi)容，還可以直接通過HTML片段修改DOM節(jié)點內(nèi)部的子樹航徙。
style 屬性對應(yīng)所有的CSS如贷，可以直接獲取或設(shè)置。遇到-需要轉(zhuǎn)化為駝峰命名到踏。
4杠袱、添加節(jié)點
innerHTML
如果這個DOM節(jié)點是空的，例如窝稿，<div></div>楣富，那么，直接使用innerHTML =
'<span>child</span>'就可以修改DOM節(jié)點的內(nèi)容伴榔，相當于添加了新的DOM節(jié)點纹蝴；如果這個DOM節(jié)點不是空的庄萎，那就不能這么做，因為innerHTML會直接替換掉原來的所有子節(jié)點塘安。
appendChild 把一個子節(jié)點添加到父節(jié)點的最后一個子節(jié)點糠涛。
insertBefore 把子節(jié)點插入到指定的位置。
setAttribute 在指定元素中添加一個屬性節(jié)點兼犯，如果元素中已有該屬性改變屬性值忍捡。
5、刪除節(jié)點
刪除一個節(jié)點切黔，首先要獲得該節(jié)點本身以及它的父節(jié)點砸脊，然后，調(diào)用父節(jié)點的removeChild把自己刪掉纬霞。
