jQuery 删除HTML元素，jqueryhtml元素_H5之家 - 中国HTML5教程资源分享第一站

jQuery 删除HTML元素，jqueryhtml元素

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

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

empty() – 清空指定元素的子元素

例如：

<!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：

<!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>元素：

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

Jquery查找删除指定的html

<div class="delete">how are</div>

jQuery 代码:$("p").remove(“.delete”);
结果:how are

怎使用Jquery删除元素

由于我们需要经常动态去改变DOM元素，因此Jquery提供了两种删除节点的方法，即remove()和empty();
4.1 remove()方法
$(p).remove();// 我们可以获取到要删除的元素，然后调用remove()方法
$(ul li:eq(0)).remove().appendTo(ul);// 删除ul下面的第一个li标记，然后再把删除的li标记重新加到ul里面，remove()方法
返回删除元素的引用，这时你可以继续使用
$(ul li).remove(li[title!=ABC]);//remove可以接受通过参数来选择性的删除符合条件的元素;
4.2 empty()方法
严格来讲，empty()方法并不是删除元素，而是清空例：HTML代码<ul
<li title=AAAAAA</li</ulJQuery代码
$(ul li:eq(0)).empty();结果<ul
记住，只会清空内容，不会请空属性;