XMLHttpRequest property

Instantiates the XMLHttpRequest object for the window.

Syntax

JavaScript	`p = object.XMLHttpRequest`

Property values

Type: Object

the XMLHttpRequest.

Standards information

XMLHttpRequest, Section 3

Remarks

Despite its name, this method does not return an XMLHttpRequest object directly. Instead, it returns an IHTMLXMLHttpRequestFactory, which can be used to create an XMLHttpRequest object.

If the FEATURE_XMLHTTPREQUEST feature has been disabled, this method will return a Variant of type null. See CoInternetIsFeatureEnabled.

If the cross-domain request feature has been disabled in Windows Internet Explorer, this method returns null.

XMLHttpRequest was introduced in Windows Internet Explorer 7

Examples

The following script demonstrates how to create and use the XMLHttpRequest object:

JavaScript


if (window.XMLHttpRequest)
{
   var oReq = new XMLHttpRequest();
   if (oReq) {
      oReq.open("GET", "http://localhost/test.xml");
      oReq.send();
      console.log(oReq.statusText);
   }
}

This example lets you load portions of a text file by setting the byte range to retrieve using setRequestHeader:

HTML


<!DOCTYPE html>
<html >
  <head>
    <title>setRequestHeader example</title>

  </head>
  <body>
    <div>Enter a file, start and end point of a range. </div><br />
  
    <label>Start Range: <input id="startRange" placeholder="Type a place to start" /></label><br />
    <label>End Range: <input id="endRange" placeholder="Type a place to end"/></label><br />
    <label>File: <input id="filename" placeholder="Type a text file" /></label><br />
    <button id="getFile">Get file</button><br />
    <div id="output" style="display:block; overflow:auto; max-width:800px"></div>
        
    <!-- Put script below HTML to ensure elements are loaded --> 
    <script>
      //  Get data from the HTML elements 
      document.getElementById("getFile").addEventListener("click", function () {
        var url = document.getElementById("filename").value.toString();
        var range = document.getElementById("startRange").value.toString();
        range += "-" + document.getElementById("endRange").value.toString();
        getData(url, range);
      }, false);

          // Get data from file  
      function getData(url, range) {
        if (url !== "") {
          var xhr = new XMLHttpRequest(); // Set up xhr request
          xhr.open("GET", url, true);   // Open the request
          xhr.responseType = "text";   // Set the type of response expected
          // If there's a range set, create a request header to limit to that range
          if (range !== undefined && range !== null && range.length > 0) {
            xhr.setRequestHeader("Range", "bytes=" + range);
          }
          xhr.send();

          //  Asynchronously wait for the data to return
          xhr.onreadystatechange = function () {
            if (xhr.readyState == xhr.DONE) {
              var tempoutput = xhr.response;
              document.getElementById("output").innerHTML = tempoutput;
            }
          }
          //  Report errors if they happen
          xhr.addEventListener("error", function (e) {
            console("Error: " + e + " Could not load url.");
          }, false);
        }
      }
    </script>

  </body>
</html>