DOM（Document Object Model）
當瀏覽器進入網頁時，將 HTML 文件會以樹狀結構的解析，此稱為 DOM Tree。
<html>
<head>
<title>我是網站</title>
</head>
<body>
<h1>主標題</h1>
<p>段落</p>
</body>
</html>
依以上 HTML 範例，所產生的 DOM Tree 示意圖如下
也就是說，可以透過 DOM 提供的介面，用來控制網頁上的節點與內容，做出網頁的效果
簡單說明使用 DOM API 取得預期節點：
// 找出 DOM 的節點為 h1 這個元素
document.querySelector('h1');
// 找出 DOM 節點為 class = .box 的元素
document.querySelector('.box');
// 找到 DOM 中，id 為 test 的元素
document.getElementById('test');
終於進入比較重點的部份了，要來練習操控網頁元素了！
這是我的學習紀錄，歡迎各路大神指點指教！
有任何問題歡迎傳訊息給我，我們下次見
iThome鐵人賽
看影片追技術