文檔物件模型得到簡化。

你好？朋友們，歡迎來到我的部落格。今天我們將簡化 DOM 的概念。

介紹

當我開始擔任 Web 開發人員時，人們經常在業界使用「DOM」這個術語。每個 JavaScript 教程都提到它，但我不知道它是什麼意思。尋找 DOM 的簡單解釋，我的探索結果與高級程式設計術語混淆了。經過長時間的搜索後現在有了理解，我認為用更簡單的解釋來幫助處於我之前情況的其他人是明智的。

解釋

當您第一次聽到 DOM 這個術語時，您首先想到的是什麼？

1. 檔

2. 物件

3. 模特兒
   
   它們是什麼意思？

---

什麼是文檔：

Web 文件通常定義為簡單的 HTML 文件。 Web 文件（例如此頁面）通常由多個文件組成，並透過 URL（統一資源定位符）進行存取。 HTML 檔案本身大部分時間都包含樣式表、背景圖片、其他圖形、Java 程式和其他檔案。

該文件是您的 Html 檔案。

文件以物件形式載入時傳送到瀏覽器。 「對象??」

什麼是對象：

物件是你在程式設計中經常聽到的術語，對物件有一個很好的理解是 javascript 的一個很好的開始。

JavaScript 中的物件可以定義為相關資料、原始型別或引用型別的無序集合，以「鍵：值」對的形式。這些鍵可以是變數或函數，在物件的上下文中分別稱為屬性和方法。可以使用括號 {…} 和可選屬性清單來建立物件。屬性是一個“鍵：值”對，其中鍵是一個字串（也稱為“屬性名稱”），值可以是任何內容。

let object = {
Key: Value
}

物件以樹狀形式圖形化表示，其中所有元素稱為節點，節點根據 HTML 語法排列進行分組，具有父子關係。

<div> <!-- parent element-->
<p><!-- child element to div element-->
<!-- text is also referred to as a node -->
Paragraph text <!-- child element top element-->
</p> 
</div>

注意： 因為絕大多數使用 DOM 的程式碼都圍繞著操作 HTML 文件，所以通常將 DOM 中的節點稱為元素，儘管嚴格來說並不是每個節點都是元素。

瀏覽器讀取文件有一個物件，可以用圖形方式表示為樹。 ** 那什麼是模型呢？ **

什麼是模型：

讓我們從字典的角度來看。

1.通常是某物的縮影。例如：- 人類心臟的塑膠模型 2. 要製作的東西的圖案。閱讀更多

理解 模型 的字典定義，讓我們將其與網頁聯繫起來，這是瀏覽器創建的 物件 的表示形式，它是一個漂亮的佈局，其中包含文字、顏色、圖像、等被組織並呈現給觀眾。所以我將其稱為接收並編譯網頁文檔後的結果。

結論

*我們這樣看*

$$ 接收 ⇾ 對流 ⇾ 示範 $$

每次第一次載入網頁以及刷新網頁時，網頁都會經過這個簡單的過程。

接收：- 它從伺服器或我們的本地電腦接收文檔，並且

對流：-文件的閱讀器並將每個元素轉換為節點

簡報：- 表示在設計的網頁中建立的要向使用者顯示的物件或樹。

在這種情況下，當對文件進行更改時，它對模組沒有直接影響。文件被儲存，瀏覽器會建立接收到的傳入文件的新對象，然後模型將被重新建立或修改。

---

恭喜你

** 哇，真是一段旅程，我很高興你讀完了本文。 **

---

總結和回饋？

感謝您花時間閱讀這篇文章！我希望它有助於簡化您的主題並提供有價值的見解。如果您發現它有幫助，請考慮關注我，以獲取有關網頁開發和其他技術主題的更易於理解的內容。

您的回饋很重要！在評論部分分享您的想法—無論是建議、問題還是您希望我改進的領域。請隨意使用反應表情符號讓我知道這篇文章帶給您的感受。 ？

---

保持聯繫？

這只是我部落格之旅的開始，我很樂意與您聯繫！讓我們一起分享想法、共同成長、共同學習。

追蹤我，讓我們保持聯絡：

• 嘰嘰喳喳
• 領英

期待收到您的來信並發展這個充滿好奇心的社區！ ？

以上是文檔物件模型得到簡化。的詳細內容。更多資訊請關注PHP中文網其他相關文章！