一、JS直接获取HTML对象的方法
document.getElementById("id名称");
document.getElementsByTagName("标签名");
document.getElementsByClassName("类名");
document.getElementsByName("表单子元素的name名字");
document.querySelector("各种合法CSS3选择器");
document.querySelectorAll("各种合法CSS3选择器");
二、根据DOM结构获取相关HTML节点的方法
一、查找元素的子节点
box.childNodes[i] 或 box.childNodes.item(i)
功能:获取第i个子节点,注意:文本节点也算数。
box.firstChild 获取第一个子节点
box.firstElementChild 获取第一个子元素节点
box.lastChild 获取最后一个节点
box.lastElementChild 获取最后一个子元素节点。
ulObj.getElementsByTagName("li") 获取ul下面所有li
二、查找祖先节点
obj.parentNode 获取obj的父节点
obj.parentNode.parentNode 获取obj的父节的父节点
上面写法后面可以继续.parentNode个数不限直到追溯到document节点为止。
三、查找兄弟节点
box.nextSibling 返回下一个兄弟节点
box.nextElementSibling 返回下一个兄弟元素节点
box.previousSibling 返回上一个节点
box.previousElementSibling 返回上一个元素节点