Question

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

例如，我想从主体中仅删除h1。其他孩子应该留下来

Answer 1

您可以使用CSS选择器。

您可以使用jQuery或VanillaJS来完成。例如，这是我的VanillaJS代码。

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

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

Answer 2

我们可以创建自己的fn来删除逐个标签的可用性。请查看这个：

＆＃13;

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');

＆＃13;

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

＆＃13;

Answer 3

您可以使用getElementsByTagName获取h1标记的HTMLCollection（不是数组）， live 。

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

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

如何删除指定的孩子？

3 个答案: