jQuery.移除元素

最新推荐文章于 2023-03-10 15:07:49 发布
最新推荐文章于 2023-03-10 15:07:49 发布
阅读量73 收藏
点赞数
原文链接：http://www.cnblogs.com/H97042/p/9370438.html
版权

移除元素

方法说明
remove()从DOM中移除匹配的元素及其所有的后代和文本节点。
detach()从DOM中移除匹配的元素及其所有的后代和文本节点。还会在内存中保留副本。通常使用remove()方法。
empty()从DOM中移除匹配元素子节点及后代。
unwrap()移除匹配子节点及其后代。

 

 

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>remove</title>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js">
</script>
</head>
<body>
<div>
<ul id="ul">
<li>hgfd</li>
<li>gffd</li>
<li>hgfe</li>
<li>hgef</li>
</ul>
</div>
<button>移除元素</button>
<script>
$('button').on('click', function () {
$('div').remove();
});
</script>
</body>
</html>

 

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>remove</title>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js">
</script>
</head>
<body>
<div>
<ul id="ul">
<li>hgfd</li>
<li>gffd</li>
<li>hgfe</li>
<li>hgef</li>
</ul>
</div>
<button>删除元素</button>
<script>
$('button').on('click', function () {
$('li').remove('#a');
});
</script>
</body>
</html>

 

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>detach</title>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js">
</script>
</head>
<body>
<div>
<ul id="ul">
<li>hgfd</li>
<li>gffd</li>
<li>hgfe</li>
<li>hgef</li>
</ul>
</div>
<button>移除元素</button>
<script>
$('button').on('click', function () {
$('div').detach();
});
</script>
</body>
</html>

 

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>empty</title>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js">
</script>
</head>
<body>
<div>
<ul id="ul">
<li>hgfd</li>
<li>gffd</li>
<li>hgfe</li>
<li>hgef</li>
</ul>
</div>
<button>删除元素</button>
<script>
$('button').on('click', function () {
$('li').empty();
});
</script>
</body>
</html>

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>unwrap</title>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js">
</script>
</head>
<body>
<div>
<ul id="ul">
<li>hgfd</li>
<li>gffd</li>
<li>hgfe</li>
<li>hgef</li>
</ul>
</div>
<button>移除元素</button>
<script>
$('button').on('click', function () {
$('ul').unwrap();
});
</script>
</body>
</html>

 

转载于:https://www.cnblogs.com/H97042/p/9370438.html

weixin_30737433
关注
Jquery添加与移除元素
m0_61902288的博客
08-12 838
Jquery添加与移除元素
jQuery移除或禁用html元素点击事件常用方法小结
12-11
本文实例讲述了jQuery移除或禁用html元素点击事件常用方法。分享给大家供大家参考，具体如下： 移除或禁用html元素的点击事件可以通过css实现也可以通过js或jQuery实现。 一、CSS方法 .disabled { pointer-events: none; } 二、jQuery方法 方法一 $(this).click(function (event) { event.preventDefault(); } 方法二 $('a').live('click', function(event) { alert("抱歉,已停用！"); event.preventDefaul
JQuery移除指定元素
热门推荐
走在奋斗的路上
11-21 2万+
几个前端使用的移除元素的方法,可能这些方法还有别的作用，但是这里只说他们清空的作用： html remove empty
jquery删除元素
云别
12-04 2032
1. jquery删除元素的方法 最常用的有两种 remove() empty() 2. 适用场景 $(“选择器”).remove() 删除当前选中的元素及其所有子元素 $(“选择器”).empty() 删除当前选中的元素下的所有子元素,不包含自身 一定要看自身的场景使用 ...
jquery中如何移除元素-remove(),empty(),detach()
凡事预则立，不预则废
08-29 4841
下面就来深拔一下其中的difference。 remove()和detach()表示移除的是选择器选中的元素，返回值相同，都是返回被删除的元素。两者不同之处是，前者会同时删除元素关联的data值和事件处理函数，但是后者只移除dom，不会删除data和事件处理函数。后者在我们删除一个元素，然后再把元素插入另一个节点的时候非常有用。 empty()表示移除的是选择器的所有子元素，返回的是选择器选中的元素
jquery手册(jquery.cuishifeng.cn网页版)2
10-18
1. **选择器**: jQuery的选择器允许你高效地选取DOM元素，如`$("#id")`选取ID为指定值的元素，`$(".class")`选取所有class为指定值的元素，`$("tag")`选取所有特定类型的元素。 2. **DOM操作**: jQuery提供了简便的...
jquery.editable-select
06-14
7. **集成和使用**：要在项目中使用 `jquery.editable-select`，需要先引入 jQuery 和插件的 JS/CSS 文件，然后对目标 `<select>` 元素应用插件。通常，这可以通过 jQuery 的 `$(document).ready()` 函数来实现。 8...
详解jquery插件jquery.viewport.js学习使用方法
10-19
该函数遍历所有在屏幕左侧的#wodsHome元素，通过$.removeClass方法移除返回按钮的隐藏类，以及遍历所有在视窗内的#wodsHome元素，通过$.addClass方法给返回按钮添加隐藏类。 综上所述，jquery.viewport.js插件为...
jQuery实现图片轮播效果代码(基于jquery.pack.js插件)
10-22
本文件提供了一个基于jquery.pack.js插件的图片轮播实现案例，涵盖了前端开发中经常用到的jQuery技术，包括动态操作页面元素、CSS样式设置和JavaScript编程技巧。这些知识的掌握对于前端开发人员来说是非常重要的，...
jquery-1.4.2.js和jquery.min-1.4.2.js
12-29
例如，`$(selector).html()`用于获取或设置元素的HTML内容，`$(selector).append()`和`.prepend()`可以向元素内部添加内容，`$(selector).remove()`则用于移除元素。这些方法提供了统一的接口，避免了原生JavaScript...
Jquery 4种移除 清空元素的方法
你总是想知道的博客
05-20 1万+
1. empty() 将匹配的元素集合的子节点元素都移除，包括子节点的嵌套元素 2. html(“”) 清空当前元素的内容 3. remove() 将匹配的元素集合从dom中移除 例如$(".cls").remove()或者$('div').remove(".cls") 注意：调用方法的元素本身也会移除 4. detach() 将匹配的元素集合从dom中移除 包括所有文本和子节点 例如: $("p").detach() 这个方法会保留 jQuery 对象中的匹配的元素，因而可以在将来再使用这些匹配的元素。
踩坑系列之使用jQuery移除元素
shao_junne博客
06-13 313
jQuery移除元素使用移除指定元素移除指定元素的子元素 移除指定元素 删除被选元素及其子元素 $("tr").remove();//删除tr以及tr的子元素 对被删元素进行过滤 $("tr").remove("#tips");//移除id为tips的tr元素 移除指定元素的子元素 jQuery empty() 方法删除被选元素的子元素 $("tr").empty();//删除所有的tr的子元素 ...
JQuery删除元素
最新发布
x2306402025的博客
03-10 1774
简单使用JQuery删除元素
jQuery之移除元素方法
sdaujsj1的博客
01-27 4566
jQuery之移除元素方法 一.empty()方法 从DOM中移除集合中匹配元素的所有子节点。 示例： div class="container"> div class="hello">Hellodiv> div class="goodbye">Goodbyediv> div> 移除方法： $('.hello').empty(); 效果： div class="
jQuery来了--添加元素，删除元素
panlu666_pl的博客
04-30 2380
添加元素添加新的HTML内容： append()：在被选元素的结尾插入内容 prepend()：在被选元素的开头插入内容 after()：在被选元素之后插入内容 before()：在被选元素之前插入内容 append()方法作用：在被选元素的结尾插入内容例.<script> $(document).ready(function(){ $("#btn1").click(functio
jQuery中添加元素删除元素的方法
weixin_44484621的博客
06-09 4004
开发工具与关键技术：VS、jQuery 作者：#33 撰写时间：撰写时间：2019年06月06日 jQuery添加元素的方法和移除元素的方法： 引入jQuery插件： <script src="jquery/1.10.2/jquery.min.js"></script> 向元素开头和结尾添加text文本内容，（红色箭头处）prepend...
JQuery 添加元素(jquery对象)，删除元素( .remove())
houyanhua1的专栏
12-17 1万+
append()，appendTo()：追加子(标签)元素。 $(a).append($(b))  等同于   $(b).appendTo($(a)) prepend()，prependTo()：前加子(标签)元素 after()，insertAfter()：后加兄弟(标签)元素 before()，insertBefore()：前加兄弟(标签)元素 empty()：清空所有子(标签)元素。
jquery移除元素同时销毁事件
Mitnick5194的博客
04-13 2345
jquery常用销毁元素的方法有empty和remove；两者删除效果是一样的，但是empty只是清空节点元素，如果节点元素绑定了事件，并不会被清楚，一定程度上会到时内存泄露，而remove则是清除一切，包括子元素的事件。 如果元素有多个子元素绑定了事件，删除元素时强烈推荐使用remove清除元素，这样才能确保绑定的事件在内存里移除。 ...
jQuery 删除元素
独行者
09-18 542
通过 jQuery，可以很容易地删除已有的 HTML 元素。 删除元素/内容 如需删除元素和内容，一般可使用以下两个 jQuery 方法： remove() - 删除被选元素（及其子元素） empty() - 从被选元素中删除子元素 jQuery remove() 方法 jQuery remove() 方法删除被选元素及其子元素 从DOM中删除所有匹配的元素。这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。但...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值