原代码如下:
<div id="wrap">
示例文本
<div id="section-1"></div>
<div id="section-2"></div>
</div>
我只要留下:
<div id="section-1"></div>
<div id="section-2"></div>
如何实现?
<div id="wrap">
示例文本
<div id="section-1">test1</div>
<div id="section-2">test2</div>
</div>
JS版本
var p = document.getElementById("wrap");
p.parentNode.appendChild(p.childNodes[1]);
p.parentNode.appendChild(p.childNodes[2]);
p.parentNode.removeChild(p);
在线测试 http://jsfiddle.net/zVAxE/1/
jQuery版本
当然你也可以通过jQuery来操作,本质上就是DOM 节点的移动和删除操作.
jQuery由于对js的api做了封装,所以会大大减少代码量,满足楼主需求的jQuery代码为
关键点为如何定位 Text Node
//$('#wrap').contents().eq(0).remove();
$('#wrap').contents().filter(function() {
return this.nodeType == 3; //Node.TEXT_NODE
}).remove();
$('#section-1').unwrap();
其实,非常非常简单,用jquery只需要这样就行了,不需要移动节点
$('#section-1').unwrap();
来个测试链接
http://jsfiddle.net/zVAxE/2/
正文完