Description
The
XMLHttpRequest is an API whose techniques exchange information between a web program and a web server. The object is given by the program’s JavaScript surroundings. Especially, recovery of information from XHR with the end goal of consistently adjusting a stacked site page is the basic idea of Ajax outline. Regardless of the name, XHR can be utilized with conventions other than HTTP and information can be as not just XML,but likewise JSON, HTML or plain content. Description
Every cutting edge program bolster the XMLHttpRequest. The XMLHttpRequest protest is utilized to trade information with a server. This implies it is conceivable to overhaul parts of a page, without distrubing the entire page. The following is the Syntax for creating an 
XMLHttpRequest object.
[xml]variable = new XMLHttpRequest();[/xml]
The legacy versions of Internet Explorer will utilize an ActiveX Object as follows.
[xml]variable = new ActiveXObject("Microsoft.XMLHTTP");[/xml]
To deal with all browsers, check if the program underpins the XMLHttpRequest protest. If it happen then create a XMLHttpRequest protest, if not, make an ActiveXObject as follows.
[xml]
<!DOCTYPE html>
<html>
<body bgcolor="skyblue">
<h1>The XMLHttpRequest Object</h1>
<p id="request">Let AJAX change this text.</p>
<button type="button" onclick="loadDoc()">Modify Content</button>
<script>
function loadDoc() {
var xhttp;
if (window.XMLHttpRequest) {
// code for modern browsers
xhttp = new XMLHttpRequest();
} else
{
// code for IE6, IE5
xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML = this.responseText;
}
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
}
</script>
</body>
</html>>
[/xml]
The id property gives a one of a kind identifier to a component inside the record. It might be utilized by an a component to make a hyperlink to this specific component.
The document is loaded event is a pleasant snare for page initialization. All components are at place and client can create interfaces on them.
The onreadystatechange function will be put away and will be called naturally every time readyState property changes
Output: Now compile the code result will be as follows.
Methods
The following are the methods of XMLHttpRequest object.
| Methods | Description |
|---|---|
| abort() | To destroy the object. |
| new XMLHttpRequest() | To build a new XMLHttpRequest object. |
| send() | To send the request from the server via GET method. |
| send(string) | To send the request from the server via POST method. |
| setRequestHeader() | To add a value pair to the header. |
| getAllResponseHeaders() | To give back the header data. |
| getResponseHeader() | Togive back the particular header data. |
Properties
The following are the properties of XMLHttpRequest object.
| Properties | Description |
|---|---|
| onreadystatechange | The onreadystatechange function will be put away and will be called naturally every time readyState property changes |
| responseText | Give back the response data in the form of a string. |
| responseXML | Give back the response data in the form of a XML. |
| readyState | To catch the status of the XMLHttpRequest. 0: request not initialized 1: server connection established 2: request received 3: processing request 4: request finished and response is ready |
| status | To give back the status-number of a request 200: OK 403: Forbidden 404: Not Found |
| statusText | To give back the status-text. |
Key Points
- The XMLHttpRequest object is the backbone of the AJAX technology.
- The XMLHttpRequest is the API that will be used by scripting languages.