# 4.1 DOM 介紹 DOM = Document Object Model，中文即「文件物件模型」。 ## DOM tree 建立 `jquery/practice/dom.html` 檔案，內容如下： ```markup

這是連結

另一個段落

``` 瀏覽器解析以上 html 後，產出的 DOM tree： ![DOM Tree](https://2181459914-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxKlBoO7pap2-WEqXbc%2F-M4No6rO0EA2T-hZJmKp%2F-M4Nsu38WyXOvHZhx0vw%2FDOM_tree.png?alt=media\&token=e5bab6c1-9205-40f2-b4b9-a502a8f63b20) 用瀏覽器開啟檔案，按下 `Cmd + Option + i` 或 `F12`，如下圖的 Elements 頁籤，展開看看，這就是瀏覽器將你寫的 html 解析出來的 DOM Tree： ![Elements 頁籤](https://2181459914-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxKlBoO7pap2-WEqXbc%2F-M4NuQzg-sxMvKth-HAA%2F-M4Nukn79n8pwi3KxGo_%2Felements_tab.png?alt=media\&token=06237927-c911-41c6-9961-de544a7b7138) ### 解析錯誤？ 試著加上以下的原始碼(可放在 `` 之前)： ```markup

這是段落

這是 div 區塊

``` 再到上述提的 Elements 頁籤觀察看看，出了什麼問題？ ## DOM Scripting javascript 本身並沒有 window、document 這種物件，這是瀏覽器解析完之後，提供給開發人員使用的，例如： window\.alert() document.getElementById() 元素.setAttribute() 元素.getAttribute() 以上這些其實都是 **DOM Scripting。**