DYNAMIC CONTENT DANS UNE DIV

Dans le head :

<script type="text/javascript" language="javascript">
function ouverture(url,id) 
{ 
	var xhr_object = null; 
	var position = id; 
	if(window.XMLHttpRequest) 
		{ xhr_object = new XMLHttpRequest(); }
	else if(window.ActiveXObject) 
		{ xhr_object = new ActiveXObject("Microsoft.XMLHTTP"); }
	else 
		{ alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); }
		
	// On ouvre la requete vers la page désirée 
	xhr_object.open("GET", url, true); 
	xhr_object.onreadystatechange = function()
	{ 
	if ( xhr_object.readyState == 4 ) 
		{ 
			if(xhr_object.status  != 200)
			{
				document.getElementById(position).innerHTML ="Erreur " + xhr_object.status;
			} 	else 
			{
				// j'affiche ou je cache dans la DIV spécifiées le contenu retourné par le fichier

				if (document.getElementById) 
				{ 
					if (document.getElementById(position).style.display == "block") 
					{ document.getElementById(position).style.display = 'none'; } 
					else if (document.getElementById(position).style.display == "none")
					{ document.getElementById(position).style.display = 'block'; } 
					else { document.getElementById(id).style.display = 'none'; }
				}
				document.getElementById(position).innerHTML = xhr_object.responseText; 
			}
		} else { document.getElementById(position).innerHTML = '<p style="text-align:center">Chargement des données en cours...</p>'; }
	} 
	// dans le cas du get 
	xhr_object.send(null);
};
</script>

Dans le body :

<a href="./page1.html" onclick="ouverture(this.getAttribute('href'),'page'); return false;">Ma page 1</a> 
<div id="page" style="display:none; width:300px; height:300px; border:1px dashed #ccc; overflow:auto">&nbsp;</div> 
<a href="./page2.html" onclick="ouverture(this.getAttribute('href'),'page2'); return false;">Ma page 2</a> 
<div id="page2" style="display:none; width:300px; height:300px; border:1px dashed #ccc; overflow:auto">&nbsp;</div>