dom元素的操作有动态创建dom元素，子父元素操作， dom元素追加，属性设置等等....
一、dom元素的获取
前面详细的总结了dom元素的获取方式，这里复习总结一下下...
- document.getElementsByClassName("") //获取到的是集合 使用规则是 数组方式
- document.getElementsByName("") //nodes 元素节点集合 数组
- document.getElementById("") // 单个对象
- document.getElementsByTagName("") //元素的名称获取 集合
二、动态创建dom元素
使用createElement()方法创建元素
语法：document.createElement(nodename)
参数：nodename；
参数描述：必须。创建元素的名称。
返回值：创建的元素节点
三、动态设置元素的属性
使用setAttribute() 方法添加指定的属性，并为其赋指定的值。如果这个指定的属性已存在，则仅设置/更改值。
语法：element.setAttribute(attributename,attributevalue)
参数：
| 参数 | 类型 | 描述 |
|---|---|---|
| attributename | String | 必需。您希望添加的属性的名称。 |
| attributevalue | String | 必需。您希望添加的属性值。 |
无返回值。
eg：
<script>
var obj = document.createElement("div");//创建元素div
obj.setAttribute("data-logo","img/a.png");//data-logo是设置的自定义属性
console.log(obj);
</script>输出结果：
获取元素的自定义属性
使用getAttribute() 方法返回指定属性名的属性值。
eg：
<script>
var obj = document.createElement("div");//创建元素div
obj.setAttribute("data-logo","img/a.png");//data-logo是设置的自定义属性
console.log(obj);
console.log(obj.getAttribute("data-logo"));
</script>输出结果：
四、内置属性的操作
js操作的是元素的行内样式
<script>
var obj = document.createElement("div");//创建元素div
obj.setAttribute("data-logo","img/a.png");//data-logo是设置的自定义属性
obj.style.backgroundColor = "red";
obj.style.width = "100px";
obj.style.height = "100px";
console.log(obj)
</script>输出结果：
那么js中如何操作元素的内嵌样式呢？
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.b{
width: 200px;
height: 200px;
background-color: palevioletred;
}
</style>
</head>
<body>
<div class="b" style="width: 200px"></div>
<script>
var b=document.getElementsByClassName("b")[0];
console.log(window.getComputedStyle(b).width);//window.getComputedStyle(元素).属性
console.log(window.getComputedStyle(b).backgroundColor)
</script>
</body>
</html>输出结果：
window.getComputedStyle(元素).属性 操作js中元素的所有样式
五、dom元素的追加
之前有提过document.write()的用法，是往body中直接打印；
对象.innerHTML 往元素内容里追加
对象.innerText 往元素文本里追加
appendChild() 是给当前元素的内容之后进行追加 //节点类型 Node
insertBefore() 将新元素添加到旧元素之前
六、dom元素里面如何操作子节点
childElementCount 子节点的个数
找父元素里面的 子节点 ，有两个属性 childNodes 返回的是所有的节点 ，children 返回的是元素节点
找元素的父级元素：parentNode， parentElement
找元素的同胞兄弟：nextSibling，nextElementSibling，nextElementSibling，previousSibling