如何删除节点
2017-04-21 本文已影响0人
斐硕人
移除指定元素方法
empty()方法
- 清空元素中的所有后代节点
- 不能删除自己本身这个节点
remove()方法
- 该节点与该节点所包含的所有后代节点将同时被删除
- 提供传递一个筛选的表达式，删除指定合集中的元素
由于要删除节点，因此我选用 remove() 方法
代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>remove element</title>
</head>
<body>
<ul>
<li><div id="0"></div>hhh0<div class="delete">delete</div></li>
<li><div id="1"></div>hhh1<div class="delete">delete</div></li>
<li><div id="2"></div>hhh2<div class="delete">delete</div></li>
<li><div id="3"></div>hhh3<div class="delete">delete</div></li>
<li><div id="4"></div>hhh4<div class="delete">delete</div></li>
<li><div id="5"></div>hhh5<div class="delete">delete</div></li>
</ul>
<script>
var hhh = document.getElementsByClassName('delete');
var hlis;
for(let i=0;i<hhh.length;i++){
hhh[i].addEventListener('click',function(){
hlis = i+"";
document.getElementById(hlis).parentNode.remove();
});
}
</script>
</body>
</html>
