我正在尝试从节点中删除所有子元素,但保留节点的实际文本内容。 就是这样:
<h3> MY TEXT <a href='...'>Link</a> <a href='...'>Link</a> <select> <option>Value</option> <option>Value</option> </select> </h3>EDITS
发布了一些工作解决方案,这很好,但我仍然有点神秘,为什么循环和删除h3.getElementsByTagName('*')不起作用。 类似的方法 (改编自Blender )同样不能完成删除子节点的过程。 有什么想法为什么会这样?
I'm trying to remove all child elements from a node but leave the actual text content of the node. I.e. go from this:
<h3> MY TEXT <a href='...'>Link</a> <a href='...'>Link</a> <select> <option>Value</option> <option>Value</option> </select> </h3>EDITS
There are a couple of working solutions posted, which is great, but I'm still a little mystified as to why looping through and removing h3.getElementsByTagName('*') doesn't work. A similar approach(adapted from Blender) likewise does not complete the process of removing child nodes. Any thoughts as to why this would be?
最满意答案
var h3=content_block.getElementsByTagName("h3")[0]; for(var i=0;i<h3.childNodes.length;i++) { if(h3.childNodes[i].nodeType==3)//TEXT_NODE { continue; } else { h3.removeChild(h3.childNodes[i]); i--; } }JSFiddle演示
编辑 :
结合i--使其看起来更短:
var h3=content_block.getElementsByTagName("h3")[0]; for(var i=0;i<h3.childNodes.length;i++) { if(h3.childNodes[i].nodeType==3)//TEXT_NODE continue; else h3.removeChild(h3.childNodes[i--]); }编辑 #2:
由@SomeGuy指出,让它更短:
var h3=content_block.getElementsByTagName("h3")[0]; for(var i=0;i<h3.childNodes.length;i++) { if(h3.childNodes[i].nodeType!=3)//not TEXT_NODE h3.removeChild(h3.childNodes[i--]); }括号也可以删除,但那样“不易读”和“混乱”,所以我把它保留在那里。
var h3=content_block.getElementsByTagName("h3")[0]; for(var i=0;i<h3.childNodes.length;i++) { if(h3.childNodes[i].nodeType==3)//TEXT_NODE { continue; } else { h3.removeChild(h3.childNodes[i]); i--; } }JSFiddle demo
Edit:
Combined the i-- to make it look shorter:
var h3=content_block.getElementsByTagName("h3")[0]; for(var i=0;i<h3.childNodes.length;i++) { if(h3.childNodes[i].nodeType==3)//TEXT_NODE continue; else h3.removeChild(h3.childNodes[i--]); }Edit #2:
Pointed out by @SomeGuy, make it even shorter:
var h3=content_block.getElementsByTagName("h3")[0]; for(var i=0;i<h3.childNodes.length;i++) { if(h3.childNodes[i].nodeType!=3)//not TEXT_NODE h3.removeChild(h3.childNodes[i--]); }The brackets can be removed too, but that would be "less readable" and "confusing", so I keep it there.
更多推荐
发布评论