Untitled

<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">

<html>
  <head>
    <title></title>
<script>

    function makeAjaxQueryFlight(){

      // create an XMLHttpRequest
      var xhttp = new XMLHttpRequest();

      // create a handler for the readyState change
      xhttp.onreadystatechange = function() {

        readyStateChangeHandler(xhttp);

      };

      // get XML file by making async call
      xhttp.open("GET", "Question1.xml", true);
      xhttp.send();
    }

    // handler for the readyState change
    function readyStateChangeHandler(xhttp){

      if (xhttp.readyState == 4){
        // readyState = 4 means DONE

        if(xhttp.status == 200){
          // status = 200 means OK

          handleStatusSuccess(xhttp);

        }else{
          // status is NOT OK

          handleStatusFailure(xhttp);

        }
      }

    }

    // XMLHttpRequest failed
    function handleStatusFailure(xhttp){

      // display error message

      var displayDiv = document.getElementById("display");

      displayDiv.innerHTML = "XMLHttpRequest failed: status " + xhttp.status;
    }

    // XMLHttpRequest success
    function handleStatusSuccess(xhttp){

      var xml = xhttp.responseXML;

      // parse the XML into an object
      var flighObj = parseXMLflightInfo(xml);

      // display the object on the page
      displayWeather(flightInfoObj);
    }

    // parse the XML into an object
    function parseXMLWeather(xml){

      // print XML on the console
      // console.log(xml);

      //create an object to hold the information in the xml file
      var flightInfoObj = {};

      // get the flightInfo XML element
      var flightInfoElement = xml.getElementsByTagName("flightInfo")[0];

      // get the date XML element
      var dateElement = flightInfoElement.getElementsByTagName("date")[0];

      // get the date
      flightInfoObj.date = dateElement.textContent;

      // get the flight XML element
      var flightElement = flightInfolement.getElementsByTagName("flight")[0];

      // get the flight
      flightInfoObj.flight = flightElement.textContent;

      // get the depart XML element
      var departElement = flightInfoElement.getElementsByTagName("depart")[0];

      // get the depart
      flightInfoObj.humidity = departElement.textContent;

      // get the arrive XML element
      var arriveElement = flightInfoElement.getElementsByTagName("arrive")[0];

      // get the arrive
      flightInfoObj.wind = arriveElement.textContent;

      // get the boarding XML element
      var boardingElement = flightInfoElement.getElementsByTagName("boarding")[0];

      // get the boarding speed
      flightInfoObj.boarding = boardingElement.textContent;

      // get the carrier XML element
      var carrierElement = flightInfoElement.getElementsByTagName("carrier")[0];

      // get the carrier speed
      flightInfoObj.carrier = carrierElement.textContent;

      return flightInfoObj;

    }

    // display the weather object on the page
    function displayFlightInfo(flightInfoObj){
      // print the weatherObj on the console
      // console.log(weatherObj);

      // construct HTML code to display weather information
      var html = "<h1>" + flightInfoObj.queryLocation + "</h1>";

      html = html + "<font size='5' color='gray'>" + flightInfoObj.date + "</font>";
      html = html + "<br /><br />";

      html = html + "<font size='7'>" + flightInfoObj.flight + "</font>";
      html = html + "&deg;" + flightInfoObj.depart;
      html = html + "<br /><br />";

      html = html + "<i>arrive: " + flightInfoObj.arrive + "</i>";
      html = html + "<br />";

      html = html + "<i>boarding: " + flightInfoObj.boarding + "</i>";

      html = html + "<i>carrier: " + flightInfoObj.carrier + "</i>";

      // show the constructed HTML code in the display div
      var displayDiv = document.getElementById("display");
      displayDiv.innerHTML = html;
    }

</script>
  </head>
  <body>

    <h1> Test </h1>

    <button onClick="makeAjaxQueryFlight()">
    Test
    </button>

    <br /><br />

    <div id="display">
    </div>

  </body>
</html>