JS使用removeChild 删除元素节点

最新推荐文章于 2024-08-16 22:36:01 发布

无名前端小白

最新推荐文章于 2024-08-16 22:36:01 发布

阅读量7.1k

点赞数

分类专栏： Javascript

本文链接：https://blog.csdn.net/byc233518/article/details/46584883

版权

Javascript 专栏收录该内容

88 篇文章 1 订阅

订阅专栏

<!doctype html>
<html
<head>
	<meta charset="UTF-8">
	<title>test</title>
</head>
<body>
	<button id="btn2">删除</button>
	<ul class="ul">
	    <li>橘子</li>
	    <li>草莓</li>
	    <li>哈密瓜</li>
	    <li>苹果</li>
	    <li>葡萄</li>
	    <li>猕猴桃</li>
	</ul>

<script>
var ulObj = document.getElementsByClassName("ul")[0];
var btn2Obj = document.getElementById("btn2");
btn2Obj.οnclick=function(){
    var len=ulObj.getElementsByTagName('li').length;
    var firstLi=ulObj.getElementsByTagName('li')[0];
    var lastLi=ulObj.getElementsByTagName('li')[len-1];
    if(len==1){
        return;
    }
   if(firstLi.innerHTML=='苹果'){
       ulObj.removeChild(lastLi);
       //lastLi=null;
   }else{
       ulObj.removeChild(firstLi);
       //firstLi=null;
   }
}
</script>
</body>
</html>