DOM:文档对象模型：文档指的是网页：把网页变成一个Js可以操作的对象，给了JS可以操作页面元素的能力；
DOM:操作基础：获得操作的对象：
1.获得标签的 方法：（id选择法）；
document.getElementById
document是DOM操作的关键字；get获得 element 元素 by 通过；
-------假如设置一个div id=“dic”--------
var dic=document.getElementById（“dic”）；
dic.style.backgroundColor="red";
--------------无论之前是什么颜色都会被改成红色；----
2.通过TagName（标签名）获得标签；
var array=document.getElementsByTagName（“p”）；
for（var a=0；a<array.length; a++）{
array[a].style.backgroundColor=“blue”；
}
3.通过className获得你标签（类名）
----------设置一个div类名为oge
var array1=document.getElementsByClassName("oge");
array1[0].style.color="orange";
----------html5标准提供的新方法来获得标-------
1.查询单个标签
querySelector：query查询；selector方法；
（1）通过id来获得：
document.querySelector("#id").style.backgroudColor='orange”;
（2）通过className获得：
document.querySelector(".dic").style.backgroundColor="skyblue";
（3）通过tagName获得
document.querySelector("div'").style.backgroundColor="pink";
----------------------只选中一个标签-------
2.查询多个标签(数组）：
（1）className
var array=document.querySelectorAll（“oge”）；
for (var a=0;a<=array.length;a++){
array[a].style.backgroundColor=“yellow”；
}
（2）tagName
var array2=document.querySelectorAll（“div”）；
for（var a=0; a<array2.length;a++）{
array2[a].style.backgroundColor="skyblue";
}
-----------------------创建新的标签---------------------------
(1)创建一个新的标签
var p = document.createElement("p");
(2)找到这个div
var div = document.querySelector("div");
(3)给div增加子标签
div.appendChild(p);
------------------------删除标签元素------------ ---------------
1.找到要删除的标签
var div = document.querySelector("div");
2.找到父标签
var body = document.querySelector("body");
3.让body删除它上面的子元素div
body.removeChild(div);
------------------删除的子元素中的子元素都会跟着这个div删除----
多个相同标签在不同的父标签中：
------ 利用遍历数组，然后找到每一个a标签的父标签删除他们 -------
for(var n = 0;n<array.length;n++){
-------------parentNode是父标签元素，让a标签的父标签删除自己----------
array[n].parentNode.removeChild(array[n]);
}
-----------------------替换-------------------
（1）找到要被替换的标签
var button = document.querySelector("button");
(2)创建一个新的标签
var div = document.createElement("div");
div.style.width = "200px";
div.style.height = "200px";
div.style.backgroundColor = "orange";
(3)替换他们 replaceChild(替换的元素，被替换的元素)
button.parentNode.replaceChild(div,button);
----------------插入--------------------
insertBefore(将要插入的元素,原有元素);
新建一个标签，放到h4标签之前
（1）创建要增加的新标签
var newDiv = document.createElement("div");
newDiv.style.width = "200px";
newDiv.style.height = "200px";
newDiv.style.backgroundColor= "skyblue";
(2)要找到h4标签
var h4 = document.querySelector("h4");
(3)调用h4的父亲将newDIV插入到h4之前
h4.parentNode.insertBefore(newDiv,h4)；