Question

The page is mostly in PHP and only lightly uses any JavaScript, so I do not wish to use jQuery when it must be possible without it. I want to update a portion of a page, but I’m not very experienced with Ajax. jQuery’s method was to use the page’s URL with “#sectionid” after it.

Answer 1

All the information you’d need to know to hand-roll your own is here:

https://developer.mozilla.org/en/XMLHttpRequest

You’ll be interested in the send, open, response, readyState and onreadystatechange sections of the documentation.

onreadystatechange will fire whenever the readyState of your request changes. Once your readyState has changed to done you can check the response you received.

Make sure when you open you open in async mode. You don’t want to freeze your page by making synchronous http requests.

if you need it running on older versions of I.E. wikipedia has some good information:
http://en.wikipedia.org/wiki/XMLHttpRequest#Support_in_Internet_Explorer_versions_5.2C_5.5_and_6

I assume you know how to use document.getElementById and element.innerHTML to set the content of your element.

---

EDIT
Went ahead and added a basic implementation:

if (window.XMLHttpRequest) {// IE7+, Firefox, Webkit, Opera
  window.xmlhttp = new XMLHttpRequest();
} else {// IE6, 5
  window.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
     document.getElementById("someId").innerHTML = xmlhttp.responseText;
  }
}

xmlhttp.open("GET", "pageUrl", true);
xmlhttp.send();