jquery如何删除子元素

发布网友

我来回答

6个回答

热心网友

1、删除元素和内容,可以通过jquery的remove()和empty()方法,remove()删除选择的元素和子元素,empty()只删除选中元素的子元素。

2、新建一个html页面,引入jquery.js,页面body里面添加一个div盒子,div盒子里面添加两段话,和一个删除div元素的按钮,js中调用$(“#div1”).remove()方法删除元素。

3、在浏览器中打开html页面之后,可以看到div盒子和两段话,点击移除div元素按钮。

4、点击移除div元素按钮之后,可以看到div元素和子元素p都被删除掉了。

5、将$(“#div1”).remove()方法注释掉,使用$(“#div1”).empty()方法,删除选择元素的子元素。

6、可以看到点击清空div元素按钮,将div元素的p子元素删除了。

热心网友

jquery中children()可以选择子元素,remove()可以删除元素,所以可用如下代码删除子元素

$(object).children(selector).remove();  // 删除object元素下满足selector选择器的子元素,不填写则默认删除所有子元素

示例如下:

创建Html元素

<div class="top">
<div>
<li>list 1-1</li>
<li>list 1-2</li>
<li>list 1-3</li>
</div>
<div>
<li>list 2-1</li>
<li>list 2-2</li>
<li>list 2-3</li>
</div>
</div>

设置css样式

div{padding:10px 20px;margin:10px;}
div.top{width:500px;height:200px;border:4px solid #33cc33;}
div.top div{min-height:60px;border:4px solid #ccc;}

编写jquery代码

$(function(){
$("div.top div").click(function() {
$(this).children('li').remove();  // 删除div下的子元素li
});
})

显示效果

热心网友

$("div span:gt(0)").remove();

使用了楼上哥们的,我在这里说明一下

gt是大于的意思,0其实代表的就是1

remove从字眼上看就知道是去除的意思了。

热心网友

$("div").find("span")[0].remove();

试试行不行

热心网友

可以参考下这个 http://www.erlo.vip/share/3/18

热心网友

$("div span:gt(0)").remove()

声明声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:11247931@qq.com