JS DOM的各种选择器详解

dom操作提供给了我们动态插入html代码的功能，所谓dom操作，就是将整个html页存储为一个树形结构，去访问和修改其节点。

js的选择器指的是我们如何找到想要的元素所在的节点，主要包括以下几种：

1、根据ID访问HTML元素

document.getElementById();

2、根据CSS选择器访问HTML

document.querySelector(selectors); //只返回符合选择器参数的第一个HTML元素

document.querySelectorAll(selectors);//返回符合选择器参数的HTML元素集合

3、利用节点关系访问HTML元素

document.getElementById().parentNode();//获取当前节点的父节点

document.getElementById().previousSibling();//获取当前节点的前一个兄弟节点

document.getElementById().nextSibling();//获取当前节点的下一个兄弟节点

document.getElementById().childNodes();//获取当前节点的所有子节点

document.getElementById().getElementByTagName(tagName);//获取当前节点的具有指定标签名的所有的子节点

document.getElementById().firstChild();//获取当前节点的第一个子节点

document.getElementById().lastChild();//获取当前节点的最后一个子节点