AJAX exercises

Save the following html file on your computer:
<html><head>
<script>
var request

function popupfile() {
  request = new XMLHttpRequest();
  request.onreadystatechange = function() {
    if (request.readyState==4) {
      var text = request.responseText;
      first100chars = text.slice(0,100);
      document.getElementById("HERE").innerHTML = first100chars;
    }
  }
  request.open("GET","http://de.wikipedia.org/robots.txt",true);
  request.send(null);
}

</script>
</head>
<body>

<div id="HERE">Change this</div>
<input type='button' onclick="popupfile()" value='click here' />
</body></html>
1) Open it in Internet Explorer and click the button. Try it in a different browser. Most likely the other browser won't show any text because of security reasons. What kind of security problem might be involved?

In theory you could use request.getAllResponseHeaders() instead of request.responseText or request.getResponseHeader('Last-Modified'); or request.statusText but most likely none of these will work because of security restrictions.

2) Read the content from a text file. Save a text file in the same directory as the script. Then change the URL to the name of the text file and use request.responseText.

3) Read the content from an XML file. Use var xmldoc = request.responseXML; and then use some DOM statement (for example: xmldoc.getElementsByTagName('...').item(0).nodeName) to display an XML tag from your file.

4) Check how the browser's "view source" or "back button" work with respect to the page you just created.

Question: Do you now have an idea of what AJAX is about?

Question: AJAX Security