Crear html reutilizable para la barra de navegación en varias páginas

Pensé que sería conveniente tener código reutilizable, especialmente para la barra de navegación porque será el mismo en todas mis páginas. De esta manera no tendré que pasar por cada página y editar manualmente cada una individualmente cuando ocurra un cambio.

Parece posible usar iframes, pero lo probé y todo el estilo de la página se salió de control. Puedo arreglarlo, pero me pregunto si hay algo similar.

Sería increíble si algo como esto pudiera funcionar:

var navbar = document.getElementById ('navbar');
navbar.innerHtml = url ('navigation.txt');

Actualmente estoy trabajando sin conexión en mi sitio, así que no creo que pueda hacer solicitudes xmlhttp. ¿Correcto? Al menos todavía tengo que obtener algún ejemplo de ajax para trabajar. Esto es lamentable porque creo que podría usarlo fácilmente para mi aplicación.

Aquí está mi marcado de barra de navegación. No es muy complicado, así que tengo la sensación de que lo editaré manualmente al final.

<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>