节点对象三大属性:
1.nodeType number
专门区分节点的类型：
9 document
1 element
2 attribute
3 text
2.nodeName 节点名 字符串
document #document
element 全大写的标签名
attribute 属性名
文本节点 #text
3.nodeValue 节点值
document null
element null
attribute 属性值
text 文本的内容
查找DOM树
三个元素不需要找，直接获得：
<html> document.documentElement
<head> document.head
<body> document.body
节点之间的关系
1.父子关系
node.parentNode 获得node的父节点
node.childNodes 获得node的所有子节点
node.firstChild 获得node下的第一个子节点
node.lastChild 后的node下最后一个子节点
2.兄弟关系
node.preivousSibling: 返回当前节点的前一个兄弟节点
node.nextSibling:返回当前节点的下一个兄弟节点
元素树
父子关系
elem.parentElement 返回一个父元素对象
elem.childen 返回子元素对象集合
elem.firstElementChild 返回第一个子元素对象
elem.lastElementChild 返回最后一个子元素
兄弟关系
返回当前节点的前一个兄弟元素
elem.preivousElementSibling
返回当前节点的下一个兄弟元素
elem.nextElementSibling
按HTML查找
1.id 只能用document调用 仅返回一个元素
document.getElementById
2.tagName 查找指定父元素下的指定标签元素 任何父元素都可以调用
document.getElementsByTagName
3.name属性查找 查找表单 只能用document调用 返回：动态数组
document.getElementsByName
4.按class属性查找 只能通过任意父元素上调用 查找的子代 只要标签中class属性值符合要求的就被选中
getElementsByClassName
按选择器查找
查找一个条件复杂的元素,既可以找一个元素,也可以找多个元素,selector可以写css中的选择器
var elem = parent.querySelector()
var elem = parent.querySeletorAll()
getElement 和Selector的差别
返回值：getElement 返回动态集合 Selector返回非动态集合
效率: getElement 首次查找效率高 Seletor首次查找效率低
易用性:selector更简单 getElement更繁琐
核心DOM:可以操作一切结构文档，访问标准的HTML属性
获取属性值:getAttribute
修改属性:setAttribute
移除属性:removeAttribute