我要在所有页面上使用相同的固定标题-是否可以链接动态HTML或Javascript

Question

I have a website that is mostly done in HTML and CSS with some JS.

Ive now set up a page where header is perfect to me - it is FIXED contains Divs with a Logo, a search bar and phone number. Underneath this div is a Navbar that is controlled by master Javacript file as a template and also the Navbar fades upon scroll with JS.

My question is how do I set it up so that the entire header with all that styling can be replicated on 80 pages and I just have to change it once?

I've tried this below - where an external page header1.html has the header code (of which has full html head, body, etc) but when I load it all, the page calls up the header1.html quickly and then disappears.

<script src="//code.jquery.com/jquery-1.10.2.js"></script> in head

<div id="header"></div>
<script> 
  $("#header").load("header1.html"); 
</script> 

end body

Answer 1

header1.html should NOT contain a full html document. Rather, it should just be the snippet of html code that you need for the header stuff.

Answer 2

You can use php. Place the content from the header in header.html, place te next code in every page where you want show the header.

<?php include 'header.html'; ?>

Note: change your files from .html to .php