Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • .detach() method in jQuery

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 43
    Comment on it

    The detach() method removes the selected elements, including all text and child nodes. However, the advantage of using this method is that it keeps data and events i.e keeps a copy of the removed elements, which allows them to be reinserted at a later time.

    Program to detach an element from DOM and then reattach it.

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>detach demo</title>
      <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    </head>
    <body>
     
    <p>Hello</p>
    how are
    <p>you?</p>
    <button>Attach/detach paragraphs</button>
     
    <script>
    var a;
    $( "button" ).click(function() {
      if ( a ) 
      {
        a.appendTo( "body" );
        a = null;
      } else 
      {
        a = $( "p" ).detach();
      }
    });
    </script>
     
    </body>
    </html>

    Explanation:

    The detach() method removes the selected elements "p" in this case. A variable a is declared and on the basis of that vale "p" element is detached from DOM or appended to the body. On clicking of button value of a is checked which if true then element "p" is attached to the body else it is detached from body. The variable a  keeps a copy of the removed elements when detached method is applied to "p" element and checking it's value "p" is appended to body through a and assigning it to null to maintain toggling effect of attaching and detaching "p" element.

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: