JS中如何删除某个元素下的所有⼦元素（节点）？
JS中如何删除某个⽗元素下的所有⼦元素？这⾥我介绍⼏种⽅法：
1.通过元素的 innerHTML 属性来删除
  这种⽅式我觉得是最有⽅便的，直接到你想要的⽗元素，直接令其 element.innerHTML = "";
  举例说明：
<input type="button" value="按钮" id="btn">
<div id="dv">
<p>1</p>
<p>2</p>
<p>3</p>
</div>
<script>
}
</script>
2.通过 removeChild() ⽅法来删除
  removeChild() 的⽤法是先到⽗级元素parent，然后调⽤ veChild(thisNode) 来删除当前⼦节点（thisNode），那我们只要循环遍历删除所有的即可。
  举例说明：
<input type="button" value="按钮" id="btn">
<div id="dv">
<p>1</p>
<p>2</p>
<p>3</p>javascript说明
</div>
<script>
// 获取 div 标签
var div = ElementById("dv");
// 获取 div 标签下的所有⼦节点
var pObjs = div.childNodes;
for (var i = pObjs.length - 1; i >= 0; i--) { // ⼀定要倒序，正序是删不⼲净的，可⾃⾏尝试
}
}
</script>
  注意：循环遍历的时候⼀定要倒序，因为正序的时候，当你把索引为0的⼦节点删除后，那么原来索引为1的就变成了0，⽽这时变量 i 已经变成1了，程序继续⾛时就会删除原先索引为２的现在为1的节点，结果就是最后只删除了⼀半的节点，朋友们可⾃⾏尝试理解⼀下。
3.通过 jQuery 中 empty() ⽅法来删除
  语法：
    $(selector).empty()
  举例说明：
<input type="button" value="按钮" id="btn">
<div id="dv">
<p>1</p>
<p>2</p>
<p>3</p>
</div>
<script src="jquery-3.4.1.js"></script>
<script>
$("#btn").click(function () {
$("#dv").empty();
})
</script>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。