jQuery load() Method Last Updated : 07 Jul, 2023 Comments Improve Suggest changes Like Article Like Report jQuery load() method is a simple but very powerful AJAX method. The Load() method in jQuery helps to load data from the server and returned it to the selected element without loading the whole page. Syntax: $(selector).load(URL, data, callback);Parameters: This method accepts three parameters as mentioned above and described below: URL: It is used to specify the URL which needs to load.data: It is used to specify a set of query key/value pairs to send along with the request.callback: It is the optional parameter which is the name of a function to be executed after the load() method is call.Example 1: The geeks.txt file is stored on the server and it will load after clicking the click button. The content of geeks.txt are: Hello GeeksforGeeks! HTML <!DOCTYPE html> <html> <head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> $(document).ready(function () { $("button").click(function () { $("#div_content").load("gfg.txt"); }); }); </script> <style> body { text-align: center; } .gfg { font-size: 40px; font-weight: bold; color: green; } .geeks { font-size: 17px; color: black; } #div_content { font-size: 40px; font-weight: bold; color: green; } </style> </head> <body> <div id="div_content"> <div class="gfg"> GeeksforGeeks </div> <div class="geeks"> A computer science portal for geeks </div> </div> <button> Change Content </button> </body> </html> Output: There is also an additional callback function in the parameter which will run when the load() method is completed. This callback function has three different parameters: parameter 1: It contains the result of the content if the method call succeeds.parameter 2: It contains the status of the call function.parameter 3: It contains the XMLHttpRequest object.Example 2: An alert box will appear after clicking on the button and if the content loaded successfully then it will give a message "Content loaded successfully!". Otherwise, it will show an error message. HTML <!DOCTYPE html> <html> <head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> $(document).ready(function () { $("button").click(function () { $("#div_content").load("gfg.txt", function (response, status, http) { if (status == "success") alert("Content loaded successfully!"); if (status == "error") alert("Error: " + http.status + ": " + http.statusText); }); }); }); </script> <style> body { text-align: center; } .gfg { font-size: 40px; font-weight: bold; color: green; } .geeks { font-size: 17px; color: black; } #div_content { font-size: 40px; font-weight: bold; color: green; } </style> </head> <body> <div id="div_content"> <div class="gfg"> GeeksforGeeks </div> <div class="geeks"> A computer science portal for geeks </div> </div> <button> Change Content </button> </body> </html> Output: Comment More infoAdvertise with us K kundankumarjha Follow Improve Article Tags : Web Technologies JQuery jQuery-Methods Similar Reads jQuery ajax() Method The jQuery ajax() method is used to perform asynchronous HTTP requests, allowing you to load data from a server without reloading the webpage. It provides a flexible way to interact with remote servers using GET, POST, or other HTTP methods, supporting various data formats.Syntax:$.ajax({name:value, 4 min read jQuery ajaxSetup() Method The ajaxSetup() method in jQuery is used to set the default values for future AJAX requests. Syntax: $.ajaxSetup( {name:value, name:value, ... } )Parameters: type: It is used to specify the type of request.url: It is used to specify the URL to send the request to.username: It is used to specify a us 3 min read jQuery | get() Method In jQuery .get() method loads data from the server by using the GET HTTP request. This method returns XMLHttpRequest object. Syntax $.get( url, [data], [callback], [type] ) Parameters url : String containing the URL at which request is to be sent data : This is an optional parameter that represents 2 min read jQuery getJSON() Method In this article, we will learn about the getJSON() method in jQuery, along with understanding their implementation through the example. jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, It is widely famous for its philosophy of âWrite less, do 2 min read JQuery | parseJSON() method This parseJSON() method in jQuery takes a well-formed JSON string and returns the resulting JavaScript value. Syntax: jQuery.parseJSON( json )Parameters: The parseXML() method accepts only one parameter that is mentioned above and described below: json: This parameter is the well-formed JSON string 2 min read jQuery getScript() Method The getScript() method in jQuery is used to run a JavaScript using AJAX HTTP GET request. Syntax: $(selector).getScript(url, success(response, status))Parameters: It contains two parameters as mentioned above and described below: url: It is a required parameter. It holds the url to whom the request 2 min read jQuery param() method The param() method in jQuery is used to create a serialized representation of an object. Syntax: $.param( object, trad )Parameters: This method accepts two parameters as mentioned above and described below: object: It is a mandatory parameter that is used to specify an array or object to serialize.t 2 min read jQuery | post() Method The post() method in jQuery loads the page from server using POST HTTP request and returns XMLHttpRequest object. Syntax: $.post( url, data, callback_function, data_type ) Parameters: This method accepts four parameters as mentioned above and described below: url: It is the required parameter and us 2 min read jQuery ajaxComplete() Method The ajaxComplete() method is used to specify a function to be run when an AJAX request completes. Syntax: $(document).ajaxComplete(function(event, xhr, options))Parameter: event: It contains the event object. xhr: It contains the XMLHttpRequest object. options: It contains the used options in AJAX r 2 min read jQuery ajaxError() Method The ajaxError() method in jQuery is used to specify a function to be run when an AJAX request fails. Syntax: $(document).ajaxError( function(event, xhr, options, exc) )Parameters: This method accepts single parameter function which is mandatory. This function accepts four parameters which are listed 2 min read Like