这是我参与8月更文挑战的第9天，活动详情查看：8月更文挑战
在现在各种数据驱动试图的框架下，我们对dom的操作是越来越少了，但是还是会有很多时候需要我们去对dom进行操作，所以，我们对dom的原始操作还是不能忘，就让我们再学习学习吧\
document.documentElement === body
获取
document.getElementById(idName) // 通过id号来获取元素，返回一个元素对象
document.getElementsByName(name) // 通过name属性获取，返回元素对象数组
document.getElementsByClassName(className) // 通过class来获取元素，返回元素对象数组
document.getElementsByTagName(tagName) // 通过标签名获取元素，返回元素对象数组
element.parentNode // 获取当前元素的父节点，返回当前元素的父节点对象
element.children // 获取当前元素的子节点，返回当前元素所有子元素节点对象，只返回HTML节点
element.childNodes // 获取当前元素的子节点，返回当前元素多有子节点，包括文本，HTML，属性节点。（回车也会当做一个节点）
element.firstChild // 获取当前元素的子节点，返回当前元素的第一个子节点对象，包括文本
element.lastChild // 获取当前元素的子节点，返回当前元素的最后一个子节点对象
element.nextSibling // 获取当前元素的同级元素，返回当前元素的下一个同级元素 没有就返回null 能获取空格 nextElementSibling
element.previousSibling // 获取当前元素的同级元素，返回当前元素上一个同级元素 没有就返回null 能获取空格
element.innerHTML // 获取当前元素的文本，返回元素的所有文本，包括html代码
element.innerText // 获取当前元素的文本，返回当前元素的自身及子代所有文本值，只是文本内容，不包括html代码
获取当前节点的节点类型：node.nodeType // 返回节点的类型,数字形式（1-12）常见几个1：元素节点，2：属性节点，3：文本节点。
element.getAttribute(attributeName) //括号传入属性名，返回对应属性的属性值 // 获取元素的属性值
设置
element.setAttribute(attributeName,attributeValue) // 设置元素的属性值，传入属性名及设置的值
element.style.color=“#eea”; //设置元素的样式时使用style，这里以设置文字颜色为例。
创建
document.createElement(“div”) // 创建一个html元素，这里以创建div元素为例
document.createTextNode(String); // 创建一个文本节点；
document.createAttribute(“class”); // 创建一个属性节点，这里以创建class属性为例
新增
element.appendChild(Node); // 往element内部最后面添加一个节点，参数是节点类型
elelment.insertBefore(newNode,existingNode); // 在element内部的中在existingNode前面插入newNode
city.innerHtml += “广州 “ // 插入
删除
element.removeChild(Node) // 删除当前节点下指定的子节点，删除成功返回该被删除的节点，否则返回null
element.replaceChild(newNode,existingNode) 替换节点
node.parentNode.removeChild(element) // 从DOM中删除一个子节点。返回删除的节点。
<div id="top" align="center">
<div id="nested"></div>
</div>
// 先定位父节点,然后删除其子节点
var d = document.getElementById("top");
var d_nested = document.getElementById("nested");
var throwawayNode = d.removeChild(d_nested);
总结：
大家都会觉得用jQuery来操作dom会更加的方便且好用，因为jq对js的dom进行了封装，使得我们Write Less, Do More。但是我觉得还是要总结一下原生js的dom，从根本上了解js对dom的操作，只会有利而无害。
相对比较新的几个操作，但其实兼容性已经很好了，平时也都有用
docment.all // 获取页面所有元素
document.querySelector(“.box”) // 根据一个css选择器查询一个元素节点对象
document.querySelectorAll(“.box”) // 根据一个css选择器查询一个元素节点对象数组
