DOM元素的创建和操作
- 创建DOM元素
<ul>
</ul>
<script>
// DOM创建的三种方法
//1. document.write("");
var li1 = document.write("<li>我是document.write创建的</li>");
//2.boj.innerHTML =
//3.利用DOM元素的API创建元素
var ul = document.getElementsByTagName("ul")[0];
var li2 = document.createElement("li");
li2.innerHTML = "我是createElement创建的";
ul.appendChild(li2);
var li3 = document.createElement("li");
li3.innerHTML = "我要插在li2前面"
ul.insertBefore(li3,li2);
2. 操作DOM元素
//元素的操作
//1.删除元素:removeChild()方法从DOM中删除一个子节点。返回删除的节点。
//ul.removeChild(li2);
//2.交换元素:replaceChild()用指定的节点替换当前节点的一个子节点,并返回被替换掉的节点
//ul.replaceChild(li2,li3);
//3.克隆元素:cloneNode
for(var i=0; i<=3; i++){
var newLi = li2.cloneNode(true);
ul.appendChild(newLi);
}
①删除li2元素
②交换li2和li3
③克隆li2