AJAX / XHR Skjelett


Ren (ingen rammeverk) startkode man kan bruke for å implentere XHR til å utføre AJAX operasjoner (snakke med serversiden uten å relaste nettsiden)

function ajaxFunction() {
	var xmlHttp;
	if(window.XMLHttpRequest) {
		xmlHttp=new XMLHttpRequest();
	} else if (window.ActiveXObject) {
		xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
	} else {
		alert("Your browser does not support AJAX!");
		return false;
	}
	
	xmlHttp.open("GET","links.txt",true);
	xmlHttp.onreadystatechange=function() {
		if(xmlHttp.readyState==4) {
			document.getElementById('relatedLinks').innerHTML = xmlHttp.responseText;
		}
	}
	xmlHttp.send(null);
}

HTML eksempelkode:
<div id="relatedLinks">This will be filled with the link in links.txt.</div>
<a href="#" onclick="ajaxFunction()">Click me to change div content</a>

links.txt i eksemplet ovenfor:
<a href="http://www.domain.com/">The Domain!</a>

GET eksempel:
xmlHttp.open("GET","getreceiver.php?foo=bar",true); 
xmlHttp.send(null);

POST eksempel:
xmlHttp.open("POST","postreceiver.php",true);
xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlHttp.send('foo=bar');


Dette bør kun gjøres til datakilder i samme domene, et sikkerhetstilsyn i moderne nettlesere. Det har pleid å være måter å komme seg rundt dette (JSONP) men disse tingene forandrer seg stadig og bør evt. googles hvis man er nysgjerrig.