jQuery 删除或是清空某个HTML元素示例

前端技术 2023/08/09 JavaScript

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\");

本文地址：https://www.stayed.cn/item/762

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案