I thought it would be convenient to have reusable code, especially for the navigation bar because it will be the same across all of my pages. This way I won't have to go through each page and manually edit each one individually when a change occurs.
It seems possible to use iframes, but I tried it and the whole page styling went out of whack. I can fix it but I'm wondering if there's something similar.
It would be awesome if something like this could work:
var navbar = document.getElementById('navbar');
navbar.innerHtml = url('navigation.txt');
I'm currently working offline on my site so I don't think I can make xmlhttp requests. Correct? At least I still have yet to get any ajax example to work. This is unfortunate because I think I could easily use this for my application.
Here's my navbar markup. It's not very complicated so I have a feeling I'll just edit it manually in the end.
<nav>
<ul id=navbar>
<li><a href=biosketch.html>Biosketch</a></li>
<li><a href=projects.html>Class Projects</a>
<ul>
<li><a href=projects.html#SeniorProject>Senior Project</a></li>
<li><a href=projects.html#WindTurbine>Wind Turbine</a></li>
</ul>
</li>
<li><a href=#>Resume</a></li>
<li><a href=#>Work Experience</a></li>
<li><a href=#>Contact Me</a></li>
</ul>
</nav>