通俗易懂講DOM
之前寫過一篇文章 《究竟什麼是DOM?》
但是雲裡霧裡術語搞了一大堆 也沒搞明白這究竟是什麼東西。
本篇文章就是來通俗易懂的解釋什麼是DOM
DOM(文件物件模型)是針對HTML和XML文件的一個API,通過DOM可以去改變文件。
跟狗屁一樣的解釋 對吧?
最好是用例子來解釋:
舉個例子:我們有一段HTML,那麼如何訪問第二層第一個節點呢,如何把最後一個節點移動到第一個節點上面去呢?
DOM就是定義瞭如果做類似操作,那麼應該怎麼做的標準。比如用getElementById來訪問節點,用insertBefore來插入節點。
當瀏覽器載入HTML時,會生成相應的DOM樹。
簡而言之,DOM可以理解為一個訪問或操作HTML各種標籤的實現標準。
對於一個HTML來說,文件節點Document(看不到的)是它的根節點,對應的物件便是document物件(嚴格講是子HTMLDocument物件,下面單獨介紹Document型別時會指出)。
換句話說存在一個文件節點Document,然後它有子節點,比如通過document.getElementsByTagName(“html”),得到型別為元素節點的Element html。
每一段HTML標記都可以用相應的節點表示,例如:
HTML元素通過元素節點表示,註釋通過註釋節點表示,文件型別通過文件型別節點表示等。
一共定義了12種節點型別,而這些型別又都繼承自Node型別。
詳細的節點型別介紹會在另外一篇博文《DOM(文件物件模型)的12個節點型別》中詳細講述。
所以總結一下 我們不要想什麼是DOM,而是我們要時刻記住DOM樹。
相關文章
- 通俗易懂的Gradle外掛講解Gradle
- 寫一篇通俗易懂的HTTPS講解HTTP
- Diffusion Model 擴散模型-[通俗易懂+程式碼講解模型
- 用通俗易懂的方式講IO的五種模型模型
- 通俗易懂講解Word2vec的本質
- 視覺化講解DOM構建過程視覺化
- 通俗易懂的講解一下Java的代理模式Java模式
- 通俗易懂講解ML中的均方誤差 (MSE) - haltakov
- Gradle核心思想(五)通俗易懂的Gradle外掛講解Gradle
- 這可能是掘金講「原型鏈」,講的最好最通俗易懂的了,附練習題!原型
- 通俗易懂地給女朋友講:執行緒池的內部原理執行緒
- 我畫了13張圖,用最通俗易懂的話講HTTPS,拿下!HTTP
- 通俗易懂講解TCP流量控制機制,瞭解一下TCP
- 通俗易懂講解並手寫一個vue資料雙向繫結案例Vue
- BOM與DOM之DOM操作
- 通俗易懂的 SAP ABAP 會話管理(Session Management)概念講解,包含具體的例項會話Session
- 通俗易懂講解貝葉斯論和頻率論兩者之間的區別?
- 通俗易懂 Promise 原理Promise
- 通俗易懂--決策樹演算法、隨機森林演算法講解(演算法+案例)演算法隨機森林
- 網際網路協議入門-通俗易懂的講計算機網路5層結構協議計算機網路
- DOM EventListener
- DOM - 事件事件
- Dom事件事件
- DOM操作
- DOM 操作
- DOM回收
- 通俗易懂地理解ReduxRedux
- JAVA反射通俗易懂轉Java反射
- 網際網路協議入門-通俗易懂的講計算機網路5層結構(二)協議計算機網路
- 回到基礎:什麼是DOM及DOM操作?
- Vue 為什麼要用虛擬 DOM(Virtual DOM)Vue
- Declarative Shadow DOM
- DOM屬性
- 虛擬DOM
- jQuery 操作 DOMjQuery
- JS之DOMJS
- javaWeb(四)----- DOMJavaWeb
- DOM 常用方法