Load HTML with javaScript in <a href…> link

Question

I am new to the programming world and currently only know HTML , CSS , Java , and about a week of JavaScript classes. My task is to create a website that has all these certain requirements. I have my skeleton HTML and CSS done and am just adding javaScript here and there.

My site has a main header logo area and a left and right column with news feeds, links, a calendar and whatnot. Currently i have about 8 pages with the same content in these areas. The center column is all that changes.

I would like to make it so that when a link is clicked ( a href="... ) it will load a javaScript function (with .innerHTML=".."; in it) into my centerColumn div tag. So that if i want to update the right or left columns i don't have to change it on every single page.

I'm not set on using .innerHTML its just the only thing i know so far. If there is a better way or if you can import a whole .html file that would be fine.

I've tried many different things to no avail. Any help or suggestions would be awesome! Thanks

Answer 1

I suggest you may use ajax, either jquery or javascript. Jquery is lot easier then javascript. I find $.ajax lot easier to use.

$.ajax({
        type:"POST",
        url:"linktoyourajaxpage.php",
        data:{data:val1,data2:val2},
        cache:false,
        success:function(html){
            $("#resultdiv").html(html);

        }



    }); 

where resultdiv is the div where you want result to appear.