.detach()

要素を削除します。削除後もjQueryから参照することが可能です。

.remove()と同じような挙動をしますが、.detachの場合は関連付けられているjQueryの情報を削除後も保持します。 削除した要素を、後ほど再度使用したい場合などに便利です。

.detach( [selector] ) 1.4追加

戻り値:jQuery

引数 説明
[selector] マッチしている要素から、削除対象とする要素をフィルタリングします。

デモ

P要素の取り外し、取り外したP要素の再度挿入を繰り返します。

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>p { background:yellow; margin:6px 0; } p.off { background: black; }</style>
  5. <script src="http://code.jquery.com/jquery-latest.js"></script>
  6. </head>
  7. <body>
  8. <p>こんにちは、</p>
  9. 調子はどう
  10. <p>ですか?</p>
  11. <button>P要素を挿入/取り外し</button>
  12. <script>
  13. $("p").click(function(){
  14. $(this).toggleClass("off");
  15. });
  16. var p;
  17. $("button").click(function(){
  18. if ( p ) {
  19. p.appendTo("body");
  20. p = null;
  21. } else {
  22. p = $("p").detach();
  23. }
  24. });</script>
  25. </body>
  26. </html>

 Back to top

© 2010 - 2017 STUDIO KINGDOM