jQuery load()

jQuery load()
Load data from the server and place the returned HTML into the matched element.The jQuery load() method is a simple, but powerful AJAX method.The load() method loads data from a server and puts the returned data into the selected element.
Syntax of load() :
$(selector).load(URL,data,callback);

The parameters of the load() method:
·         The required URL parameter specifies the URL of the file you want to load.
·         The optional data parameter specifies a set of query string (i.e. key/value pairs) that is sent to the web server along with the request.
·         The optional complete parameter is basically a callback function that is executed when the request completes. The callback is fired once for each selected element.

Example of the load() method :-
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("#div2").load("demo_test.txt");
    });
});
</script>
</head>
<body>
<div id="div2"></div>
<button>Get External Content from external file </button>
</body>
</html>

Example 2-
<!DOCTYPE html>
           
<html>
<head>
    <meta name="viewport" content="width=device-width" />
                <script type="text/javascript"
            src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">
    </script>
                <script type="text/javascript">
        $(document).ready(function () {
                                               
                                 $('#loadBtn').click(function(){
                                               
                                                $('#msgDiv111').load('/jquery/getdata', // url
                                                                                { name: 'bill' },    // data
                                                                                function(data, status, jqXGR) {  // callback function
                                                                                                                alert('data loaded');
                                                                                });

                                });
    });
    </script>
</head>
<body>
                <h1> jQuery load() method demo
                </h1>
                <input type="button" id="loadBtn" value="Load Data" />
               
                <div id="msgDiv111"></div>
</body>
</html>