BOM和DOM區(qū)別
- BOM 是瀏覽器對象模型，描述了與瀏覽器進(jìn)行交互的方法和接口喝检，根本對象是
window - DOM 是文檔對象模型嗅辣，描述了處理網(wǎng)頁內(nèi)容的方法和接口，根本對象是
document
DOM 的基本思想是把結(jié)構(gòu)化文檔(HTML,XML)解析成一系列的節(jié)點(diǎn)挠说，再由這些節(jié)點(diǎn)組成一個(gè)樹狀結(jié)構(gòu)(DOM Tree)
創(chuàng)建節(jié)點(diǎn)
let p = document.createElement('p');
let node = document.createTextNode("node");
p.appendChild(node);
方法和屬性
| 名稱 | 描述 |
|---|---|
getAttribute() |
查詢元素的屬性 |
setAttribute() |
設(shè)置元素的屬性 |
parentNode() |
返回當(dāng)前節(jié)點(diǎn)的父節(jié)點(diǎn) |
childNodes() |
返回當(dāng)前節(jié)點(diǎn)的所有子節(jié)點(diǎn)的數(shù)組 |
createElement() |
創(chuàng)建節(jié)點(diǎn) |
createTextNode() |
創(chuàng)建文本節(jié)點(diǎn) |
appendChild() |
插入節(jié)點(diǎn) |
removeChild() |
刪除節(jié)點(diǎn) |
cloneNode |
克隆節(jié)點(diǎn) |
insertBefore(newNode,oldNode |
將新節(jié)點(diǎn)插入到舊節(jié)點(diǎn)前澡谭，從舊節(jié)點(diǎn)的父節(jié)點(diǎn)中 |
replaceChild(newNode,oldNode) |
用新節(jié)點(diǎn)取代舊節(jié)點(diǎn)，從舊節(jié)點(diǎn)的父節(jié)點(diǎn)中 |
| 屬性 | 描述 |
|---|---|
innerHTML |
獲取元素內(nèi)容 |
nodeName |
獲取節(jié)點(diǎn)的名稱 |
NodeValue |
獲取節(jié)點(diǎn)的值 |
NodeType |
獲取節(jié)點(diǎn)的類型 |
除了innerHTML屬性损俭，也可以使用childNodes和nodeValue 屬性來獲取元素的內(nèi)容
表格的方法
| 方法 | 說明 |
|---|---|
tab.insertRow(索引位置) |
在表格指定索引位置添加一行空行 |
tab.deleteRow(索引位置) |
在表格指定索引位置刪除一行 |
row.insertCell(索引位置) |
在行的指定索引位置添加一個(gè)空單元格 |
row.deleteCell(索引位置) |
在行的指定位置刪除一個(gè)單元格 |
