jQuery 刪除或是清空某個HTML元素示例
更新時間：2014年08月04日 10:36:41 投稿：whsnow
刪除HTML元素可以使用remove及empty，下面有關(guān)這兩個方法的使用將以示例的方式為大家介紹下
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()方法也支持一個參數(shù)，可以用于過濾一些需要刪除的HTML元素。這個參數(shù)可以為任何有效的jQuery selector.
比如下面代碼只刪除class=”italic”的<p>元素：
$("p").remove(".italic");
您可能感興趣的文章:
- jQuery使用append在html元素后同時添加多項(xiàng)內(nèi)容的方法
- jquery動態(tài)添加帶有樣式的HTML標(biāo)簽元素方法
- jquery html動態(tài)添加的元素綁定事件詳解
- JQuery給元素添加/刪除節(jié)點(diǎn)比如select
- Jquery顯示、隱藏元素以及添加刪除樣式
- jQuery動態(tài)添加、刪除元素的方法
- Jquery動態(tài)添加及刪除頁面節(jié)點(diǎn)元素示例代碼
- jQuery添加刪除DOM元素方法詳解
- JQuery實(shí)現(xiàn)ul中添加LI和刪除指定的Li元素功能完整示例
- jQuery動態(tài)添加及刪除表單上傳元素的方法(附demo源碼下載)
- jquery html添加元素/刪除元素操作實(shí)例詳解
相關(guān)文章
jquery調(diào)用asp.net 頁面后臺的實(shí)現(xiàn)代碼
前一篇介紹jquery調(diào)用webservice，這一篇引用的是用jquery直接調(diào)用aspx后臺方法。2011-04-04
比較常用的限制字符輸入數(shù)功能(比如熱火超天的微博輸入框),用jQuery和原生JavaScript分別寫了一個.原生JavaScript注釋中有區(qū)分中英文字符的函數(shù), 但個人并不建議這么做.2010-09-09
JS JQUERY實(shí)現(xiàn)滾動條自動滾到底的方法
這篇文章主要介紹了JS JQUERY實(shí)現(xiàn)滾動條自動滾到底的方法,需要的朋友可以參考下2015-01-01
jQuery使用有一段時間了，但是有一些API的實(shí)現(xiàn)實(shí)在想不通。小編參考相關(guān)資料源碼，現(xiàn)在把我的學(xué)習(xí)過程和收獲分享給大家2016-05-05
jQuery中隊(duì)列queue()函數(shù)的實(shí)例教程
這篇文章主要介紹了jQuery中隊(duì)列queue()函數(shù)的實(shí)例教程,queue()函數(shù)為JavaScript函數(shù)的執(zhí)行順序控制操作提供了便利,需要的朋友可以參考下2016-05-05
這篇文章主要介紹了jQuery1.9+中刪除了live以后的替代方法 的相關(guān)資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-06-06
下面小編就為大家?guī)硪黄獙?shí)用jquery操作表單元素的簡單代碼。小編覺得挺不錯的， 現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-07-07
使用jQuery仿蘋果官網(wǎng)焦點(diǎn)圖特效
這篇文章主要介紹了使用jQuery仿蘋果官網(wǎng)焦點(diǎn)圖特效,非常的炫酷，需要的朋友可以參考下2014-12-12
jQuery中attr()與prop()函數(shù)用法實(shí)例詳解(附用法區(qū)別)
這篇文章主要介紹了jQuery中attr()與prop()函數(shù)用法,結(jié)合實(shí)例形式詳細(xì)分析了attr()與prop()函數(shù)的使用技巧與相關(guān)注意事項(xiàng),并附帶了attr()與prop()函數(shù)用法的區(qū)別,需要的朋友可以參考下2015-12-12
jQuery中圖片展示插件highslide.js的簡單dom
Highslide是一個非常美觀的圖片燈箱插件，下面這篇文章主要給大家介紹了關(guān)于jQuery中圖片展示插件highslide.js的簡單dom，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2018-04-04