Dom操作之操作和删除节点

操作节点

以该内容为操作例子

	 <ul id="box">
	      <li>1</li>
	      <li>2</li>
	      <li>3</li>
	 </ul>

• appendChild() 添加节点

  	var div = document.createElement("div");
      var str = document.createTextNode("Dom操作之操作节点");
      div.appendChild(str);
      var obody = document.body;
      obody.appendChild(div);
  

• insertBefore() 插入节点

      var oli = document.createElement("li");
      var ocontent = document.createTextNode("4");
      var box = document.getElementById("box");
      oli.appendChild(ocontent);
      box.insertBefore(oli,box.children[1])
  

• replaceChild() 取代节点

      var newnode = box.replaceChild(oli, box.children[1]);
  

• cloneNode() 复制节点

• normalize() 合并相邻的文本节点并删除空的文本节点

• splitText() 按照指定的 offset 把文本节点分割为两个节点

删除节点

• Ele.removeChild()

      var box = document.getElementById('box');
      box.removeChild(box.firstElementChild);