JavaScript完成插入节点方法总结
时间：2024/5/23作者：未知来源：争怎路由网人气：
- 'outside').toLowerCase(); var range = this.ownerDocument.createRange(); if(where === 'inside') { range.selectNodeContents(this); range.surroundContents(node); range.detach(); }else if(where === 'outside') { range.selectNode(this); range.surroundContents(node); range.detach(); } return node; };
五、测试
测试代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>插入节点.html</title> <script type="text/javascript" src='./insertNode.js'></script> </head> <body> <p id='p' style='background:#888;border:1px solid #888;padding:10px;'>坐标p</p> <p id='inside' style='background:#0f0;border:1px solid #888;padding:10px;'>inside</p> <p id='outside' style='background:#F00;border:1px solid #888;padding:10px;'>outside</p> <script type="text/javascript"> var p = document.getElementById('p'); var beforep = document.createElement('p'); beforep.innerHTML = 'beforep'; beforep.style.background = '#eee'; var prepEndp = document.createElement('p'); prepEndp.innerHTML = 'prepEndp'; prepEndp.style.background = '#ff0'; var appendp = document.createElement('p'); appendp.innerHTML = 'appendp'; appendp.style.background = '#0ff'; var afterp = document.createElement('p'); afterp.innerHTML = 'afterp'; afterp.style.background = '#f0f'; p.before(beforep); p.prepend(prepEndp); p.append(appendp); p.after(afterp); //测试文本插入 p.append('[我是乐小天，我来测试直接插入文本]'); //测试外包含和内包含 var outside = document.getElementById('outside'); var inside = document.getElementById('inside'); outside.applyElement(inside, 'inside'); </script> </body> </html>结果图：
参考书目：《javascript框架设计》、《javascript高级程序设计》、《JavaScript设计模式与开发实践》
总结：以上就是本篇文的全部内容，希望能对大家的学习有所帮助。更多相关教程请访问JavaScript视频教程，jQuery视频教程，bootstrap教程！
以上就是JavaScript实现插入节点方法总结的详细内容，更多请关注php中文网其它相关文章！
网站建设是一个广义的术语，涵盖了许多不同的技能和学科中所使用的生产和维护的网站。
关键词：JavaScript完成插入节点办法总结