。
1.問題描述
通過上次web課的學習，老師給我們講解了什麼是DOM，可能由於自己學習層次太淺，一直沒搞明白為什麼要使用DOM,直接用HTML不是更方便嗎？所以接下來我就談談這個問題。
2.問題分析
首先我們都知道HTML是一種用來描述網頁的標記語言，是使用標記標籤來描述網頁的，Web瀏覽器的作用是讀取HTML文檔，並以網頁的形式顯示出它們。瀏覽器不會顯示HTML標籤，而是使用標籤來解釋頁面的內容。然後我們也清楚DOM是Document Object Model(文檔對象模型)的縮寫，那麼它是幹什麼的呢？
通過各種資料和百度可以得知，DOM是W3C（全球資訊網聯盟）的標準。DOM定義了訪問HTML和XML文檔的標準DOM是中立於平臺和語言的接口，它允許程序和腳本動態地訪問和更新文檔的內容、結構和樣式。HTML DOM將HTML文檔視作樹結構。這種結構被稱為節點樹。下面就是W3Cschool上面的HTML DOM Tree實例：
下面生動形象的用實例講解的DOM樹：
通過 HTML DOM，樹中的所有節點均可通過JavaScript 進行訪問。所有 HTML 元素（節點）均可被修改，也可以創建或刪除節點。
DOM，簡單點來說就是將你的客戶端（IE/Google等）以樹狀結構從大到小拆分成單一的對象讓你進行操作。通過JavaScript，可以重構整個HTML文檔。可以自由的進行添加、移除、改變或者重排頁面上的項目。只要想改變頁面某個東西，都可以用JavaScript獲得對HTML文檔中所有元素進行訪問的入口，而這些入口和對HTML元素進行添加、移動、改變或移除的方法和屬性，都是通過DOM來獲得的。也就是說，DOM可以幫助JavaScript能更好的和頁面進行交互。
3.總結
通俗的講，DOM定義了表示和修改文檔所需的對象、行為和屬性，以及這些對象之間的關係。當你想要改變網頁行為的時候你該怎麼辦呢？你不會用腳來踹網頁或者用頭來頂網頁吧？這時候怎麼辦呢 ？正好你手中有JavaScript 這種工具！所以你就會考慮用JavaScript來改變網頁行為，而這時候你會想 我怎麼改變呢？而我發現 網頁原來有接口的，就好像你推車有車柄一樣，你可以作用於車柄讓它往前走，同樣的你也會作用於網頁的接口改變他的行為，而這個接口就是DOM。所以 JavaScript和DOM 就好像你的手和車柄一樣，你不會用你的頭去撞車柄，同樣你也不會用CSS去改變網頁行為！當然手也不只是限於推車，還可以做別的事情，JavaScript也一樣可以幹別的事情！
所以通過比較HTML和DOM，我們可以發現，HTML的優點是方便直觀，能較快速的掌握布局，缺點是無法動態地綁定局部事件，不能直接保存子元素以便以後的動態修改。但DOM操作正好可以彌補這些。
更多精彩文章：
什麼是機器學習
關於網頁首頁設計的一點思考
新手小白應該如何學習MUI
聊一聊編程的本質
深入理解瀏覽器內核 - 概述
深入理解瀏覽器內核 - 瀏覽器內核介紹
深入理解瀏覽器內核 - 瀏覽器內核依賴關係
python快速求解不定積分和定積分
AI告訴你張無忌最愛的竟是...
Jupyter快速編輯高大上數學公式 泰勒展開式
Jupyter快速編輯高大上數學公式 常見希臘字母
基本初等函數 指數函數
基本初等函數 指數函數 代碼篇
聊一聊JavaWeb面試
聊一聊單片機和伺服器
50行代碼實現簡單的網站伺服器
50行代碼實現網站伺服器 2
50行代碼實現網站伺服器 3
Tomcat源碼分析之 doGet方法(一)
Tomcat源碼分析之 doGet方法(二)
Tomcat源碼分析之 doGet方法(三)
Tomcat源碼分析之 doGet方法(四)
Tomcat源碼分析之中文亂碼(一)
一種基於狀態機的 DOM 樹生成技術(1)
一種基於狀態機的 DOM 樹生成技術(2)
點擊頁面右下角「寫留言」發表評論，期待您的參與！期待您的轉發！