這兩天學習JS的時候接觸了幾次DOM，那麼今天有接觸了DOM，而且是主要講授關於DOM的知識，那麼什麼是DOM呢？
文檔對象模型（Document Object Model，簡稱DOM），是W3C組織推薦的處理可擴展標誌語言的標準編程接口。在網頁上，組織頁面（或文檔）的對象被組織在一個樹形結構中，用來表示文檔中對象的標準模型就稱爲DOM。目的是爲了能讓js操作html元素而指定的一個規範.DOM是HTML在瀏覽器中的表示形式，允許您操縱頁面。
D（document）：document的意思是文檔，在dom中會將HTML這個頁面給解析爲一個文檔，並在解析的同時會提供一個 document對象。
O（object）：object就是對象，相必大家對於這個都不陌生，而DOM則把HTML頁面中的所有元素都解析爲一個對象。
M（model）：M代表的就是model（模塊），主要表現的是dom裏面各個對象之間的關係。
HTML中的DOM樹：
節點
根據 DOM，HTML 文檔中的每個成分都是一個節點。（一棵節點樹中的所有節點彼此都是有關係的。）
DOM 是這樣規定的：
- 整個文檔是一個文檔節點
- 每個 HTML 標籤是一個元素節點
- 包含在 HTML 元素中的文本是文本節點
- 每一個 HTML 屬性是一個屬性節點
- 註釋屬於註釋節點
<html>
<head>
<title>DOM Tutorial</title>
</head>
<body>
<h1>DOM Lesson one</h1>
<p>Hello world!</p>
</body>
</html>
除文檔節點之外的每個節點都有父節點。舉例，<head> 和 <body> 的父節點是 <html> 節點，文本節點 "Hello world!" 的父節點是 <p> 節點。
大部分元素節點都有子節點。比方說，<head> 節點有一個子節點：<title> 節點。<title> 節點也有一個子節點：文本節點 "DOM Tutorial"。
當節點分享同一個父節點時，它們就是同輩（同級節點）。比方說，<h1> 和 <p>是同輩，因爲它們的父節點均是 <body> 節點。
節點也可以擁有後代，後代指某個節點的所有子節點，或者這些子節點的子節點，以此類推。比方說，所有的文本節點都是 <html>節點的後代，而第一個文本節點是 <head> 節點的後代。
節點也可以擁有先輩。先輩是某個節點的父節點，或者父節點的父節點，以此類推。比方說，所有的文本節點都可把 <html> 節點作爲先輩節點。
節點訪問
通過 DOM，您可訪問 HTML 文檔中的每個節點。
- 通過使用 getElementById() 和 getElementsByTagName() 方法
- 通過使用一個元素節點的 parentNode、firstChild 以及 lastChild 屬性
getElementById() 和 getElementsByTagName() 方法的區別：
getElementById()
作用：根據指定的ID值獲取對象，如果無符合條件的對象，則返回 null
用法：var 變量名= document . getElementsById( 'id名')
getElementByName()
作用：返回帶有指定名稱的對象的集合
用法：var 變量名= document . getElementsByName( 'name名')
區別：1）getElementById()取單個元素
2) getElementByName()取元素集合
相關參考鏈接：
https://www.cnblogs.com/baijinshuo/p/9774963.html
https://jingyan.baidu.com/article/cb5d6105d1ac49005d2fe011.html