Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to create clone of any object using jQuery?

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 97
    Comment on it

    Cloning of Object using jQuery

    For cloning any any object using jQuery, jQuery provides clone() method which is performing a deep copy of the set of matched elements i.e clone method not only copies the matched elements but also all descendant elements and text nodes of the matched element.

    Example of cloning of any object using clone() method of jQuery:

    <!doctype html>
    <head>
    <title>JQuery Clone Method</title>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    </head>
    <h3>JQuery Clone Method Example</h3>
    <script type="text/javascript">
       $(document).ready(function(){
          $("button").click(function(){
            $(".myappend").clone().appendTo("body");
          });
       });
    </script>
    <body>
       <button>Insert element</button>
       <div class="myappend">
            <p>Hello World!!!</p>
    		<div class="myappend2">
    			<p>Demo</p>
    		</div>
       </div>
    </body>
    </html>
    

    Explanation:

    In the above example of clone() method, when button is clicked then deep copy of matched element i.e div with class myappend is created. Clone() method not only make duplicate copy of selected element but also copy of it's descendants in this case copy of div with class myappend2 within selected element is also made. After clicking of button output is:

    JQuery Clone Method Example

    Hello World!!!

    Demo

    Hello World!!!

    Demo

     

 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: