參考：https://www.runoob.com/js/js-htmldom.html

介紹

DOM，document object model文件物件模型。

現在幾乎所有瀏覽器都支援DOM，用全域性物件document表示。

獲取元素物件

https://www.cnblogs.com/heibaimao123/p/16276959.html

操作元素物件

https://www.cnblogs.com/heibaimao123/p/16277512.html

document.write

<script>
document.write(Date());
</script>

• 相當於直接輸出html內容
• 不能在文件載入完成後執行，會覆蓋整體頁面

事件

1、標籤中宣告事件

<button onclick="alert(123)">點選</button>

2、js事件監聽

<script>
document.getElementById("myBtn").onclick=function(){displayDate()};
</script>

3、js新增事件

element.addEventListener("click", function(){ alert("Hello World!"); });
element.addEventListener("click", myFunction);
 

元素物件

1、建立

var para = document.createElement("p");
var node = document.createTextNode("這是一個新的段落。");
para.appendChild(node);
 
var element = document.getElementById("div1");

2、新增

element.appendChild(para);

element.insertBefore(para, child);

新增到尾部或者在child元素之前

3、移除

parent.removeChild(child);

4、替換

parent.replaceChild(para, child);
 

HTMLCollection

js獲取一組物件時，返回型別一般是HTMLCollection型別。

可以像陣列一樣，使用索引來獲取元素。但並不是陣列。

HTMLCollection 無法使用陣列的方法： valueOf(), pop(), push(), 或 join() 。

NodeList

與HTMLCollection很相似，是querySelectorAll()方法的返回型別，用於儲存節點物件集合。

HTMLCollection 元素可以通過 name，id 或索引來獲取。

NodeList 只能通過索引來獲取。

只有 NodeList 物件有包含屬性節點和文字節點。

document.cookie