溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

jQuery如何刪除已有的HTML元素內(nèi)容

發(fā)布時間：2022-02-22 10:43:19 來源：億速云 閱讀：361 作者：小新 欄目：開發(fā)技術(shù)

這篇文章主要介紹了jQuery如何刪除已有的HTML元素內(nèi)容，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

jQuery - 刪除元素
通過 jQuery，可以很容易地刪除已有的 HTML 元素。
如需刪除元素和內(nèi)容，一般可使用以下兩個 jQuery 方法：
    remove() - 刪除被選元素（及其子元素）
    empty() - 從被選元素中刪除子元素

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

<!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;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>


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

<!DOCTYPE html>
<html>
<head>
<script src="../jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("#div1").empty();
    });
});
</script>
</head>
<body>
    <div id="div1" style="height:100px;width:300px;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>


過濾被刪除的元素
jQuery remove() 方法也可接受一個參數(shù)，允許您對被刪元素進行過濾。
該參數(shù)可以是任何 jQuery 選擇器的語法，下例中刪除 class="italic" 的所有 <p> 元素：

<!DOCTYPE html>
<html>
<head>
<script src="../jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("p").remove(".italic");
    });
});
</script>
</head>
<body>
    <p>This is a paragraph in the div.</p>
    <p class="italic"><i>This is another paragraph in the div.</i></p>
    <p class="italic"><i>This is another paragraph in the div.</i></p>
    <button>刪除 class="italic" 的所有 p 元素</button>
</body>
</html>

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“jQuery如何刪除已有的HTML元素內(nèi)容”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，更多相關(guān)知識等著你來學(xué)習(xí)!

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手