JQuery移除指定元素

幾個前端使用的移除元素的方法,可能這些方法還有別的作用,但是這裏只說他們清空的作用:

  • remove() - 刪除被選元素(及其子元素和註釋---被選元素及其內部所有的內容)
  • empty() - 從被選元素中刪除子元素(被選元素內部所有的內容)
  • html("")從被選元素中刪除子元素(被選元素內部所有的內容)
  • emptyhtml是一樣作用的。

下面使用代碼進行測試:

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.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>刪除 div 元素</button>

</body>
</html>


測試remove()

這是我們測試使用的工具,w3c網址編輯頁面同時查看頁面效果,瀏覽器f12查看代碼效果。

執行remove之後的效果:


執行empty()



執行html("")


jQuery remove()方法也可接受一個參數,允許您對被刪元素進行過濾。該參數可以是任何 jQuery 選擇器的語法。

下面的例子刪除 所有 <p> 元素:

比如:

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


我們經常一塊使用的方法:

find(),parent().parents()

parents裏面要是用jQuery選擇器來定位。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章