动态创建元素的方式

一、 document.write()

 document.write("<li>我</li>");

二、 innnerHTMl

接利用innerHTML
li.innerHTML="我是第三种创建的";

三、 createElement()

操作:appendChild() removeChild() insertChild() replaceChild()

  var li=document.createElement("li");
    ul.appendChild(li);
    //指定位置添加
    var li1=document.getElementById("li1");
    ul.insertBefore(li,li1);

四、元素的操作

appendChild() 添加节点

var li2=document.createElement("li");
ul.appendChild(li2);

插入节点
insertBefore()

 ul.insertBefore(li3,li1);

删除节点
removeChild()

ul.removeChild(li3);

取代节点
replaceChild()

 ul.replaceChild(li3,li2);

克隆节点
cloneNode(true)复制节点,深层复制

for(var i=0;i<=3;i++){
   var newLi= li3.cloneNode(true);
    ul.appendChild(newLi);
}

猜你喜欢

转载自blog.csdn.net/zuo_zuo_blog/article/details/89161676