jqueryアニメーションで要素コンテンツを削除する方法-よくある問題-php.cn

jqueryアニメーションで要素コンテンツを削除する方法

尊渡假赌尊渡假赌尊渡假赌

リリース： 2023-05-29 10:16:19

オリジナル

1102 人が閲覧しました

要素コンテンツを削除するための Jquery アニメーションメソッド: 1. "children()" メソッドを使用して選択した要素のすべての子要素を返し、次に "remove()" メソッドを使用して選択した要素を削除し、子要素。構文は " $(element).children().remove();"; です。 2. "empty()" メソッドを使用して、選択した要素の子要素を削除します。構文は "$(child element ）。空の（）;"。

jqueryアニメーションで要素コンテンツを削除する方法

このチュートリアルのオペレーティングシステム: Windows 10 システム、jQuery3.6.0 バージョン、Dell G3 コンピューター。

jquery アニメーションで要素のコンテンツを削除する 2 つのメソッド:

1. Children() メソッドを使用して、選択した要素のすべての直接の子要素を返し、次に使用しますjQueryのremove()メソッドは、選択した要素とその子要素を削除します。

コードは次のとおりです。

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script><script>$(document).ready(function(){  $("button").click(function(){    $("#div1").children().remove();  });});
</script>
</head>
<body>
<div id="div1" style="height:120px;width:300px;border:1px solid black;background-color:yellow;">
<p>This is some text in the div.</p>
<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>

ログイン後にコピー

ブラウザで HTML ファイルを開き、削除ボタンをクリックして、div 要素の内容をクリアします。

屏幕截图 2023-05-29 091949.png

#2. 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;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>

ログイン後にコピー

ブラウザで HTML ファイルを開き、削除ボタンをクリックして、div 要素の内容をクリアします。

屏幕截图 2023-05-29 092249.png