js操作dom

https://www.cnblogs.com/dalaoban/p/9498218.html

DOM节点的获取

var div1 = document.getElementById("box1"); //方式一：通过id获取单个标签

var arr1 = document.getElementsByTagName("div1"); //方式二：通过 标签名 获得 标签数组，所以有s

var arr2 = document.getElementsByClassName("hehe"); //方式三：通过 类名 获得 标签数组，所以有s

方式一二获取的是标签数组，所以可以通过获取数组内元素的方式获取值

DOM访问关系的获取

DOM节点之间的关系 用法合集

获取父节点，每个节点只有一个父节点，调用方式就是 节点.parentNode。其中带element字样的方式获取的都是标签。

DOM节点操作

1.创建节点

格式如下：新的标签(元素节点) = document.createElement("标签名");

2.插入节点

父节点.appendChild(新的子节点); 

父节点.insertBefore(新的子节点,作为参考的子节点);

解释：【在参考节点前插入一个新的节点。

如果参考节点为null，那么他将在父节点最后插入一个子节点。】

3.删除节点

父节点.removeChild(子节点);

4.复制节点

要复制的节点.cloneNode(); //括号里不带参数和带参数false，效果是一样的。

要复制的节点.cloneNode(true);

5.设置节点属性

方式一：元素节点.属性;/元素节点[属性]; 方式二：素节点.getAttribute("属性名称");

6.设置节点属性

7.删除节点属性

元素样式设置

获取：elem.style.属性名

获取：elem.style.属性名 = “值”

利用id获取元素修改样式d.style.属性 = '值'