jQuery - AJAX load() Method
The load()
function of jQuery is a basic yet effective AJAX technique.
The load()
function fetches data from a server and places it in the specified element.
Syntax :-
$(selector).load(URL,data,callback);
The URL
parameter is required one. The URL you want to load is specified by the parameter.
The data
and callback
parameters are optional.
The data parameter defines a set of querystring key/value pairs to submit with the request.
The callback parameter specifies the name of a function that will be called when the load()
method has finished.
Example:-
Here is the content of our example file: "demo.htm" :
A html sample page
Welcome to html demo page.
The content of the file "demo.htm" is loaded into a particular div
element in the example below :
Let jQuery AJAX Change This Text
Output :-
Related Links
The load() Method with Callback Function
When the load()
procedure is done, the optional call-back parameter defines a callback function to run. The callback function may contain several parameters :
- responseTxt - includes the results if the call successfully completes.
- statusTxt - Includes the call status.
- xhr - XMLHttpRequest object is stored here.
After the load()
function completes, the following example shows an alert box. It shows "External material loaded successfully!" if the load()
function succeeds, and an error message if it fails :
Example:-
Let jQuery AJAX Change This Text
Output :-
Related Links