DOM:文档对象模型(Document Object Model),描述处理网页的接口和方法
1 操作文档节点的常用方法
- getElementById() 返回指定id的元素
- getElementsByTagName() 返回指定标签的元素的数组
- getElementsByClassName() 返回指定类名元素的数组
- querySelector() 返回文档中与指定选择器匹配的第一个元素
- querySelectorAll() 返回文档中与指定选择器匹配的所有元素
- appendChild() 把新的节点添加到指定节点中
- removeChild() 删除子节点
- replaceChild() 替换子节点，如果用文档中已存在的节点替换，则替换的节点会被删除
- createElement() 创建元素节点
- createTextNode() 创建文本节点
- getAttribute() 返回指定属性的属性值
- setAttribute() 设置属性值
- hasAttribute() 判断节点是否有某个属性
- innerHTML() 获取指定节点中的文本，包含标签
- innerText() 获取指定节点中的文本，不包含标签
- parentNode 当前节点的父节点
- childNodes 获取当前节点的所有子节点(数组)，包含 空白节点 标签 文本 注释
- attributes 获取当前节点的所有属性 包含 id class 自定义属性
- createAttribute() 创建属性节点
const node = document.getElementById('a')
const newAttr = document.createAttribute('t_attr')
newAttr.value='属性节点'
node.setAttributeNode(newAttr)
node.getAttribute('t_attr') //属性节点
- nodeName 获取节点的名称 元素节点：大写标签名称 文本节点：#text
- nodeType 获取当前节点的类型 元素节点:1 文本节点:3 注释节点:8
- nodeValue 获取当前节点的值 元素节点:null 文本节点：文本的值
- firstChild 获取当前节点的第一个子节点
- lastChild 获取当前节点的最后一个节点
- children 动态更新的HTMLCollection ,只包含文本节点的对象
- insertBefore(新节点,老节点) 在某个节点之前插入新的节点
BOM:浏览器对象模型（Browser Object Model），描述与浏览器交互的方法和接口
bom对象的核心是Window
window对象包含属性：document、location、navigator、screen、history、frames
location：
- window.location.href=url 跳转到某个页面
- windo.location.reload() 强制刷新当前页面 history：
- history.go(-1) 后退一页
- history.go(1) 前进一页
- history.back() 后退一页
- history.forward() 前进一页
边学习边更新
