首頁 > 文章 > web前端 > jquery怎麼刪除html元素

jquery怎麼刪除html元素

青灯夜游原創: 2021-05-19 16:49:204301瀏覽

刪除方法：1、使用remove()方法，可以刪除被選元素及其子元素，語法「$(selector).remove()」；2、使用empty()方法，可以從被選元素中刪除子元素，語法「$(selector).empty()」。

jquery怎麼刪除html元素

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

如需刪除元素和內容，一般可使用以下兩個jQuery 方法：

#remove() - 刪除被選元素（及其子元素）
empty() - 從被選元素中刪除子元素

#jQuery remove() 方法

jQuery remove() 方法刪除被選取元素及其子元素。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.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;">

这是 div 中的一些文本。
<p>这是在 div 中的一个段落。</p>
<p>这是在 div 中的另外一个段落。</p>

</div>
<br>
<button>移除div元素</button>

</body>
</html>

效果圖：

jquery怎麼刪除html元素

jQuery empty() 方法

jQuery empty() 方法刪除被選元素的子元素。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.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;">

这是 div 中的一些文本。
<p>这是在 div 中的一个段落。</p>
<p>这是在 div 中的另外一个段落。</p>

</div>
<br>
<button>清空div元素</button>

</body>
</html>

效果圖：

jquery怎麼刪除html元素

相關影片教學推薦：jQuery教學（影片）

以上是jquery怎麼刪除html元素的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：js怎麼改變css屬性值下一篇：js怎麼改變css屬性值

看更多