DOM方法和属性

BOM和DOM区别

• BOM 是浏览器对象模型，描述了与浏览器进行交互的方法和接口，根本对象是window
• DOM 是文档对象模型，描述了处理网页内容的方法和接口，根本对象是document

DOM 的基本思想是把结构化文档(HTML,XML)解析成一系列的节点，再由这些节点组成一个树状结构(DOM Tree)

创建节点

let p = document.createElement('p');
let node = document.createTextNode("node");
p.appendChild(node);

方法和属性

名称	描述
getAttribute()	查询元素的属性
setAttribute()	设置元素的属性
parentNode()	返回当前节点的父节点
childNodes()	返回当前节点的所有子节点的数组
createElement()	创建节点
createTextNode()	创建文本节点
appendChild()	插入节点
removeChild()	删除节点
cloneNode	克隆节点
insertBefore(newNode,oldNode	将新节点插入到旧节点前，从旧节点的父节点中
replaceChild(newNode,oldNode)	用新节点取代旧节点，从旧节点的父节点中

属性	描述
innerHTML	获取元素内容
nodeName	获取节点的名称
NodeValue	获取节点的值
NodeType	获取节点的类型

除了innerHTML属性，也可以使用childNodes和nodeValue 属性来获取元素的内容

表格的方法

方法	说明
tab.insertRow(索引位置)	在表格指定索引位置添加一行空行
tab.deleteRow(索引位置)	在表格指定索引位置删除一行
row.insertCell(索引位置)	在行的指定索引位置添加一个空单元格
row.deleteCell(索引位置)	在行的指定位置删除一个单元格

demo地址

参考文章推荐
什么是DOM？
JavaScript学习总结（三）BOM和DOM详解