如何删除指定的孩子？

-1

<body> 
 
    <p>dfg</p> 
 
    <h1>yoyo</h1> 
 
    <h1>yoyo2</h1> 
 
    <ul> 
 
    <li>somo</li> 
 
    </ul> 
 
</body>

比如我想从身体中删除仅H1。其他孩子应该停留

来源

2016-11-20 igodie

的[删除由id元素（http://stackoverflow.com/questions/3387427/remove-element-by-id） –

感谢可能的复制这个问题。我刚刚和我的十几岁的儿子一起吃晚饭，并想知道同样的事情。 :) – Paul

什么样的父亲会删除他的孩子？甚至没有命名它们......这太难过了 – Myst

您可以使用getElementsByTagName拿到H1标签，这是现场的的HTMLCollection（不是数组）。

当一个元素被删除时，元素会相应地更新它们的索引，这意味着您必须从最后一个位置移除每个元素到第一个位置。

JavaScript解决方案：

var h1Elems = document.getElementsByTagName('h1'); 

for(var i = h1Elems.length - 1; i >= 0; i--){ 
    h1Elems[i].parentElement.removeChild(h1Elems[i]); 
}

See this code working in this jsfiddle

来源

2016-11-20 01:32:01 Pineda

只要说'while（h1Elems.length）h1Elems [0] .remove（）;'会更简单。 – 2016-11-20 03:05:56

这是一个优雅的选择，谢谢。 – Pineda

您可以使用CSS选择器。

你可以使用jQuery或VanillaJS。例如，这里是我的VanillaJS代码。

var headers = document.querySelectorAll('h1'); 
headers.forEach(function(h) { h.remove(); });

这将有效地从DOM中删除标题。

来源

2016-11-20 01:20:59 gretro

是的，假设你在'querySelectorAll'的结果中定义'forEach'的环境中。 – 2016-11-20 03:02:45

如果您无法访问它，则可以使用jQuery（例如）为您执行此操作，也可以使用polyfill。 – gretro

我们可以创建自己的FN按标签的可用性删除节点。请在此回顾之一：

function rem(tag) { 
 
    var h = document.querySelectorAll(tag); //return NodeList not array  
 
    [].forEach.call(h,function(elm) {    
 
     elm.parentNode.removeChild(elm); 
 
    }); 
 
} 
 

 
//passing tag to remove 
 
rem('p');

<body> 
 
    <p>dfg</p> 
 
    <h1>yoyo</h1> 
 
    <h1>yoyo2</h1> 
 
    <ul> 
 
    <li>somo</li> 
 
    </ul> 
 
</body>

来源

2016-11-20 01:36:42 RizkiDPrast

为什么'if（h.parentNode'检查是必需的？你确定'forEach'会对'querySelectorAll'的结果起作用吗？ – 2016-11-20 03:04:05

Thanks @torazaburo，我试了很多次以得到'if（h.parentNode ）'return'false'但是失败了。我刚刚编辑了我的答案，包括修复了如何通过'querySelectorAll'处理NodeList返回值。 – RizkiDPrast

如何删除指定的孩子？

回答

相关问题