js移除子元素

javascript 复制代码
removeAllChild(parentId) {
  const parentNode = document.getElementById(parentId);
  if (parentNode) {
    parentNode.innerHTML = '';
  }
}

使用innerHTML属性将其设为空字符串,可以一次性清除该元素的所有子节点内容。但是需要注意的是,innerHTML会触发重排和重绘,如果是大量DOM操作,性能消耗可能较大。如果只需要删除子节点而不需要保留原有DOM树结构或者触发事件,这种方法更为简洁高效。

如果需要保持原有的DOM树结构或者关心性能,原始的while循环是一个更好的选择。若要优化原始循环,可以尝试使用childNodes迭代器配合for循环:

javascript 复制代码
removeAllChild(parentId) {
  const parentNode = document.getElementById(parentId);
  if (parentNode) {
    for (let child; (child = parentNode.firstChild);) {
      parentNode.removeChild(child);
    }
  }
}
相关推荐
Je1lyfish9 分钟前
CMU15-445 (2025 Fall/2026 Spring) Project#3 - QueryExecution
linux·c语言·开发语言·数据结构·数据库·c++·算法
小李子呢021112 分钟前
前端八股Vue---Vue-router路由管理器
前端·javascript·vue.js
Brilliantwxx24 分钟前
【C++】 vector(代码实现+坑点讲解)
开发语言·c++·笔记·算法
野生技术架构师24 分钟前
2026年最全Java面试题及答案汇总(建议收藏,面试前看这篇就够了)
java·开发语言·面试
百锦再1 小时前
Auto.js变成基础知识学习
开发语言·javascript·学习·sqlite·kotlin·android studio·数据库开发
叼烟扛炮1 小时前
C++第三讲:类和对象(中)
开发语言·c++·类和对象
洛_尘2 小时前
Python 5:使用库
java·前端·python
Bigger2 小时前
Bun 能上生产吗?我的实战结论
前端·node.js·bun
iDao技术魔方2 小时前
DeepSeek TUI:原生 Rust 打造的终端 AI 编码 Agent
开发语言·人工智能·rust
jghhh012 小时前
认知无线电中基于能量检测的双门限频谱感知的 MATLAB 仿真
开发语言·matlab