I have an index page with 5 divs. 1 div is the header menu div where i put the buttons to link to the other pages in the website, but i do not want to make like 10 other htmls. In the middle area i have 3 divs ... on the left a vertical space where i would like to load a submenu with other buttons than the ones in the header menu ... but this is something else, also in the middle there is a right vertical div similar to this one but will be with text only. and in the center of middle is the main content div. and here is where i want to load html form an external .txt file ... and all this just by clicking the links in the menu. so if i click on the home button i get a specified text (index.txt) in the main content div, and if i click on contact i get in the main content the contact.txt content. and this way i only have the index file as html and the other as text only.
You could issue an AJAX request to download the content of the txt filed, when user clicks the button or anchor.
Are you familiar with any js libraries like jQuery? Simple example utilizing jQuery:
<input type="button" id="show_content">Show content</input>
<div id="content_div"></div>
<script type="text/javascript">
$("#show_content").click(function(){
$("#content_div").load("/my_text_content.txt");
});
</script>