ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery を使用して DIV 要素を追加または先頭に追加するにはどうすればよいですか?

jQuery を使用して DIV 要素を追加または先頭に追加するにはどうすればよいですか?

DDD
DDDオリジナル
2024-11-28 13:00:12508ブラウズ

How Can I Append or Prepend a DIV Element Using jQuery?

要素の移動: 追加と先頭へ

子を含む DIV 要素を 1 つの場所 (「ソース」) から再配置する必要性を考慮してください。 ) 別の (「宛先」) へ。望ましい結果は、ソース コンテンツが宛先コンテナ内にネストされることです。

解決策:

AppendTo メソッド:

このメソッドは、ソース要素を宛先要素の最後に移動し、最終要素になります。 child:

$("#source").appendTo("#destination");

PrependTo メソッド:

または、prependTo メソッドは、ソース要素を宛先要素の先頭に挿入し、最初の要素にします。 child:

$("#source").prependTo("#destination");

例:

プロセスを明確にするために、次のデモを検討してください:

$("#appendTo").click(function() {
  $("#moveMeIntoMain").appendTo($("#main"));
});

$("#prependTo").click(function() {
  $("#moveMeIntoMain").prependTo($("#main"));
});
#main {
  border: 2px solid blue;
  min-height: 100px;
}

.moveMeIntoMain {
  border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>

以上がjQuery を使用して DIV 要素を追加または先頭に追加するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。