<!DOCTYPE html><html><head lang="en"> ???<meta charset="UTF-8"> ???<title>节点的增删改</title></head><body><ul> ???<li>大家辛苦了1</li> ???<li>大家辛苦了2</li> ???<li>大家辛苦了3</li> ???<li>大家辛苦了4</li> ???<li>大家辛苦了5</li> ???<li>大家辛苦了6</li> ???<li>大家辛苦了7</li> ???<li>大家辛苦了8</li> ???<li>大家辛苦了9</li> ???<li>大家辛苦了10</li> ???<li>大家辛苦了11</li> ???<li>大家辛苦了12</li></ul><script type="text/javascript"> ???//首先获取页面中的第一个ul ???var ul= document.getElementsByTagName("ul")[0]; ???//创建一个新的节点 ???var ?newLi=document.createElement("li"); ???//给新节点的增加内容 ???newLi.innerHTML="<h1>哈哈</h1>"; ???//在第7 个位置之前 把新增的li放入 ???var needLi= ul.getElementsByTagName("li")[6]; ???//ul.insertBefore(newLi,needLi); // 把newLi放在needLi之前 ???//替换指定的节点 ???var repLi= ul.getElementsByTagName("li")[9]; ???ul.replaceChild(newLi,repLi); ???//删除指定的节点 ???ul.removeChild(newLi); ???//clone ?UL ???var newUl= ul.cloneNode(true); ???// 在body中增加 ul ???ul.parentNode.appendChild(newUl);</script></body></html>js操作DOM对象（节点的增删改）
原文地址：http://www.cnblogs.com/zwy0709/p/7774938.html