Skip to content
Related Articles
Get the best out of our app
GeeksforGeeks App
Open App

Related Articles

What are the uses of XMLHTTPRequest Object in Ajax ?

Improve Article
Save Article
Like Article
Improve Article
Save Article
Like Article

In this article, we will know about the XMLHttpRequest and how it can be useful for the client-server request and properties of XMLHttpRequest.

XMLHTTPRequest is an object that sends an HTTP request to the server and interacts with the server to open a URL and retrieve data without loading the complete page so only some part of the web page changed. Here, it is a global constructor function XMLHttpRequest built into the browser exposed in javascript that is available without any package added and is not only to XML documents, nowadays JSON is mostly used to exchange data between browser and server.

Uses of XMLHTTPRequest object:

  • It is used to make AJAX calls to exchange data from a remote web server. 
  • With the help of this object, users send requests to the server asynchronously and the server sends the data which we requested for ajax.
  • XMLHTTPRequest object is used to prevent attacks from the server-side
  • It is used in different protocols to make requests like HTTP, HTTPS, FTP, and FRPS.
  • It is used to retrieve any type of data like XML, JSON, etc.
  • With the help of this, there is no need to load the whole page it extracts some parts and does changes.
  • It is used in data exchange with the help of API.


var objectname = new XMLHTTPRequest();

For detailed description about the XMLHttpRequest object methods & XMLHttpRequest object properties, please refer to the AJAX XMLHttpRequest Object article.

Example: This example describes how XMLHttpRequest is used in AJAX and utilizes the different XMLHttpRequest objects for making the request and getting a response from the server using JSON data.


//create new request through constructor 
const xhrReq = new XMLHttpRequest();
//set up listener 
xhrReq.onload = () => {
//get response from the server server 
 let resJSON = JSON.parse(xhrReq.response);
//open url and get new created request"get", "", true);
//send request to server 



Example 2: This example describes the XMLHttpRequest object by using the fetching the dog API.


<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <button id="fetch" style="margin:20px">Fetch</button>
    <div id="container" style="margin:20px">
        <img id="dog-image">
<script src="script.js"></script>


    //create a new request
    var xhr=new XMLHttpRequest();
    //request is received 
        //convert string into json object
        var response=JSON.parse(xhr.response);
        var image=response.message;
    //cant get response
        alert("response failed")
    //open a request'get','',true)
    //send a request



My Personal Notes arrow_drop_up
Last Updated : 23 May, 2022
Like Article
Save Article
Similar Reads
Related Tutorials