在JavaScript中，我们可以通过removeChild（）方法来删除父元素下的某个子元素。
删除最后一个子元素 代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>删除元素</title>
<script>
window.onload = function (){
let oBtn =document.getElementById("btn");
//为按钮添加点击事件
oBtn.onclick = function (){
let oUl = document.getElementById("list");
//删除最后一个子元素
oUl.removeChild(oUl.lastElementChild);
}
}
</script>
</head>
<body>
<ul id="list">
<li>张若昀</li>
<li>任嘉伦</li>
<li>王一博</li>
<li>王俊凯</li>
<li>蔡徐坤</li>
</ul>
<input id="btn" type="button" value="删除">
</body>
</html>
运行结果：
点击删除后：
最后一个子元素蔡徐坤被删掉了
删除整个列表代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>删除元素</title>
<script>
window.onload = function (){
let oBtn =document.getElementById("btn");
//为按钮添加点击事件
oBtn.onclick = function (){
let oUl = document.getElementById("list");
//整个列表删除
document.body.removeChild(oUl);
}
}
</script>
</head>
<body>
<ul id="list">
<li>张若昀</li>
<li>任嘉伦</li>
<li>王一博</li>
<li>王俊凯</li>
<li>蔡徐坤</li>
</ul>
<input id="btn" type="button" value="删除">
</body>
</html>
运行结果：
点击删除后：
整个列表被删除了