AJAX - a very great web development technology nowaday. Use this AJAX in order to load XML and HTML files on the same website with XMLHttpRequest. And in the <code>body... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


How to setup

Step 1: Place CSS below in your HEAD section
CSS
Code:
<style type="text/css">
<!--
#contentLYR {
  position:relative;/*
  width:200px;
  height:115px;
  left: 200px;
  top: 200px;*/
  z-index:1;
}
-->
</style>
Step 2: Place JavaScript below in your HEAD section
JavaScript
Code:
<script type="text/javascript">
<!-- Begin
/*
     This script downloaded from www.JavaScriptBank.com
     Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/

// Created by: Eddie Traversa (2005) :: http://dhtmlnirvana.com/
function ajaxLoader(url,id) {
  if (document.getElementById) {
    var x = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
  }
  if (x) {
    x.onreadystatechange = function() {
      if (x.readyState == 4 && x.status == 200) {
        el = document.getElementById(id);
        el.innerHTML = '<JavaScriptBank>This is content of demo.xml file</JavaScriptBank>';//x.responseText;
      }
    }
    x.open("GET", url, true);
    x.send(null);
  }
}
//-->
</script>
Step 3: Copy & Paste HTML code below in your BODY section
HTML
Code:
<div id="contentLYR"></div>
	<script>window.onload = function(){ajaxLoader('demo.xml','contentLYR');}</script>
Step 4: downloads
Files
demo.xml