jQuery 入门教程(15): 删除HTML元素

weixin_34014555

于 2013-09-27 15:52:00 发布

阅读量63

点赞数

CC 4.0 BY-SA版权

文章标签： python javascript ViewUI

原文链接：https://my.oschina.net/u/194743/blog/164641

本文介绍了jQuery库中用于删除或清空HTML元素的方法：remove()和empty()。通过示例展示了如何使用这两个方法实现特定功能。

2019独角兽企业重金招聘Python工程师标准>>>

jQuery使用下面两个方法来删除或是清空某个HTML元素。

remove() – 删除指定的元素（包括其子元素）
empty() – 清空指定元素的子元素

例如：

[html] view plain copy print ?

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JQuery Demo</title>
<script src="scripts/jquery-1.9.1.js"></script>
<script>
$(document).ready(function () {
$("button").click(function () {
$("#div1").remove();
});
});
</script>
</head>
<body>
<div id="div1" style="height: 100px; width: 300px;
border: 1px solid black; background-color: yellow;">
This is some text in the div.
<p>This is a paragraph in the div.</p>
<p>This is another paragraph in the div.</p>
</div>
<br>
<button>Remove div element</button>
</body>
</html>

empty() 示例：

[html] view plain copy print ?

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JQuery Demo</title>
<script src="scripts/jquery-1.9.1.js"></script>
<script>
$(document).ready(function () {
$("button").click(function () {
$("#div1").empty();
});
});
</script>
</head>
<body>
<div id="div1" style="height: 100px; width: 300px;
border: 1px solid black; background-color: yellow;">
This is some text in the div.
<p>This is a paragraph in the div.</p>
<p>This is another paragraph in the div.</p>
</div>
<br>
<button>Empty the div element</button>
</body>
</html>

jQuery的remove()方法也支持一个参数，可以用于过滤一些需要删除的HTML元素。这个参数可以为任何有效的jQuery selector.
比如下面代码只删除class=”italic”的<p>元素：

[javascript] view plain copy print ?

$("p").remove(".italic");

转载于:https://my.oschina.net/u/194743/blog/164641

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

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