jquery怎麼移除某個元素

2022-03-16 19:00:23

jquery移除某個元素的方法:1、使用empty()函數,語法「指定元素物件.empty()」;2、使用remove()函數,語法「指定元素物件.remove()」;3、使用detach()函數,語法「指定元素物件.detach()」。

本教學操作環境:windows7系統、jquery1.10.2版本、Dell G3電腦。

jQuery移除元素方法

一、empty()方法

從DOM中移除集合中匹配元素的所有子節點。
範例:

<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">Goodbye</div>
</div>

移除方法:

$('.hello').empty();

效果:

<div class="container">
   <div class="hello"></div>
   <div class="goodbye">Goodbye</div>
</div>

如果

裡面包含任何數量的巢狀元素,他們也會被移走。
為了避免記憶體漏失,jQuery先移除子元素的資料和事件處理常式,然後移除子元素

二、remove()方法:

描述: 將匹配元素集合從DOM中刪除。(同時移除元素上的事件及 jQuery 資料。)

和 .empty()相似。.remove() 將元素移出DOM。 當我們想將元素自身移除時我們用 .remove(),同時也會移除元素內部的一切,包括繫結的事件及與該元素相關的jQuery資料

範例:

<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">Goodbye</div>
</div>

移除方法:

$('.hello').remove();
或者用
$('div').remove('.hello');

效果:

<div class="container">
   <div class="goodbye">Goodbye</div>
</div>

也就是說 class對應的自身的p也移除了

三、detach()方法:

從DOM中去掉所有匹配的元素

detach() 方法和.remove()一樣, 除了 .detach()儲存所有jQuery資料和被移走的元素相關聯。當需要移走一個元素,不久又將該元素插入DOM時,這種方法很有用。

四、html("")方法:

html() 方法如果未設定引數,則返回被選元素的當前內容。html("") 則清空被選元素的當前內容。

empty() 方法從被選元素移除所有內容,包括所有文字和子節點。

兩者最終實現的效果是一樣的

  • html()返回值:String 也就是說是可以用變數接收的

  • empty()返回值:jQuery 不能用變數接收

另外:

empty()方法無引數,而且清空後的子集及文字無法進行還原。而detach()和remove()方法可以將其儲存在一個變數中
如宣告變數p 寫成如下形式

var p=$('p').remove();

當需要從新新增時可以直接新增如下

p.appendTo("body");

這是detach()和remove()方法都有的功能。remove()較detach()不同的是:remove()可以刪除指定的類如remove('a'),而detach()不可這樣操作。

還要注意一點,當用remove()方法移除元素後,再進行新增,再子集的事件的不會存在,而detach()子集的事件還可執行。

【推薦學習:、】

以上就是jquery怎麼移除某個元素的詳細內容,更多請關注TW511.COM其它相關文章!