本文已参与『新人创作礼』活动，一起开启掘金创作之路
持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第14天，点击查看活动详情
// ID的上下文只能是doucment；
var id = document.getElementById("id");
//通过标签名
var ps = main.getElementsByClassName("box");
//通过选择器
var ps = main.getEleementsByClassName("box")
// 通过name名字获取一组元素
var names = document.getElementsByName("userName");
// 找出所有得标签
var items = document.querySelectorAll("*")
+ 它的上下文也只能是document
+ 另外，正常的规范中，咱们只会给表单元素起name值，如果给其它元素设置name，在ie9以下版本浏览器不
兼容，是获取不到的，所以为了这种情况，咱们以后养成习惯，只给表单元素用name，非表单元素不用name
注意：querySelector 和querySelector 在ie6-ie8 下不兼容
+ document.head // 获取Head元素对象
+ document.body // 获取body元素对象
+ document.documentElement // 获取html元素对象
节点类型
-
文档节点
nodeType：9
nadeName：#document
nodeValue：null -
元素节点
nodeType：2
nodeName：属性名
nodeValue：属性值 -
元素节点
nodeType：1
nadeName：大写的标签名
nodeValue：null -
注释节点
nodeType：8
nodeName："#comment"
nodeValue：注释的内容 -
文本节点
nodeType：3
nodeName："#text"
nodeValue：文本内容
DOM操作
1、parentNode：获取父元素节点
2、childNodes：获取所有的子节点
3、chidren：获取所有的子元素（ie6-8下不兼容）
4、previousSibling：获取上一个哥哥的节点
5、previousElementSibling：获取上一个哥哥元素节点（ie6-8下不兼容）
6、nextSibling：获取下一个兄弟节点
7、nextElementSibling：获取下一个兄弟元素（ie6-8下不兼容）
8、firstChild：获取第一个子节点
9、firstElementChild：获l取第一个子元素
10、lastChild：获取最后一个子节点
11、lastElementChild：获取第一个子元素
DOM增删改
// 创建文本标；
+ document.createElement("标签")
// 创建文本节点；
+ document.createTextNode("嘿嘿")
// 把一个元素放到容器的末尾；
+ 容器.appendChild（元素）；
// 把newle 插入到oldele的前面；
+ 容器.insertBefore(newele,oldele);
// 删除某个元素
+ 容器.removeChild( ele );
// 添加属性
box.setAttribute("index","0");
// 获取
box.getAttribute( "index" )
// 删除
box.removeAttribute("index")
元素.cloneNode()；
+ 括号里不写参数，就是只克隆当前的元素
+ 括号里写参数true，就会把这个元素并且里面的所有后代元素都给克隆一份
ele.属性 = 属性值； //设置
ele.属性 //获取
delete ele.属性 //删除
文章有错误或者遗漏地方的小伙伴可以在评论区评论哦~
