before method in jQuery with example



1. before() method insert content before each element in the set of matched elements.
2. before() method inserts the content before the element selected using selector.
3. before() and insertBefore() method performs the same task. They are different by the way they are used. Syntactically they are different.


Example 1 :



        <html>
        <head>
        <title>before</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> 
        </script>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#myButton").click(function () {
                    $("#targetP").before("<h3>Jquery is easy to learn.</h3>")
                });
            });
        </script>
        </head>
        <body>
        <p id="targetP">Jquery is amazing.</p>
        <input type="button" id="myButton" value="Before"/>
        <input type="button" id="reset" value="reset" onclick="location.reload()" />
        </body>
        </html>
    



In above example, we have a paragraph element. On click of "Before" button the paragraph element is selected and using before() method, the content passed as parameter to before() method is rendered before paragraph element.


0 comments:

Post a Comment