本文实例讲述了JS实现DOM节点插入操作之子节点与兄弟节点插入操作。分享给大家供大家参考,具体如下:
& lt; !doctype html>
& lt; html>
& lt; head>
& lt;元charset=皍tf - 8”比;
& lt; title> www.jb51.net JS节点插入& lt;/title>
& lt; script>
函数showinsert(){//添加子节点
var str=. getelementbyid (“mydiv”);
var zif="段落五”;
var obj=document.createElement (“p”);//添加哪类节点
var objNode=document.createTextNode (zif);//创建文字节点
str.appendChild (obj);
obj.appendChild (objNode);
}
函数showesideinsert(){//添加兄弟节点
var str=. getelementbyid (“mydiv”);
var子="添加段落”;
var strBrother=str.children [1];
var strNode=document.createElement(“p”);
var strTextNode=document.createTextNode(子);
str.insertBefore (strNode strBrother);
strNode.appendChild (strTextNode);
}
& lt;/script>
& lt;/head>
& lt; body>
& lt; div id=癿ydiv”比;
& lt; p>段落一
& lt; p>段落二
& lt; p>段落三
& lt; p>段落四
& lt;/div>
& lt;/body>
& lt;/html>
之前
使用:http://tools.jb51.net/code/HtmlJsRun测试运行效果如下:
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript操作DOM技巧总结》,《JavaScript错误与调试技巧总结》,《JavaScript数据结构与算法技巧总结》,《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
