Я сделал это двумя отдельными способами - один с использованием серверной части (PHP) и один с использованием Javascript (для демонстраций, которые должны иметь возможность работать без подключения к Интернету или серверных возможностей).
Поскольку PHP включает в себя, ваши страницы должны заканчиваться .php, а не .htm или .html, и они идеально подходят для замены заголовка, нижнего колонтитула, навигации и т. Д. Что-либо, что повторяется на нескольких страницах.
По сути, вы должны создать свой обычный код, а затем скопировать и вставить код, который вы хотите выделить - в этом примере - навигацию, - и сохранить его в другом файле с именем (например) inc_navigation.htm (эту страницу можно вызвать. HTM).
Тогда на ваших реальных страницах вы будете использовать следующий код:
<?php include('inc_navigation.htm') ?>
Это вставило бы вашу навигацию в тот момент, если бы у вас было изменение, которое вы бы сделали, вы бы сделали это в файле .htm, и оно распространялось бы на любую страницу с включенным.
Для включения javascript вы должны будете включить следующую строку вверху каждого документа, в который хотите включить навигацию:
<script type="text/javascript" src="includes.js"></script>
Затем вы создадите документ с именем include.js.
В верхней части этого документа вы объявите переменную навигации:
var navigation = new Array(); // This is for the navigation.
Затем немного в том же документе вам нужно набросать код навигации (номера строк в квадратных скобках имеют решающее значение - держите их в порядке и начинайте с 0 - в этом коде не должно быть разрывов строк, поэтому каждый строка кода должна быть новой строкой):
// ==================== Navigation ==================== //
navigation[0] = '<div id="tab_navigation">';
navigation[1] = '<ul id="dropline">';
navigation[2] = '<li><a href="index.htm"><b>Home</b></a></li>';
navigation[3] = '<li><a href="about_us.htm"><b>About Us</b></a></li>';
navigation[4] = '</ul>';
navigation[5] = '</div><!-- Close TAB NAVIGATION -->';
Затем, немного позже, вы фактически вставите javascript, который поместит этот код на вашу страницу (он на самом деле не помещает его туда, а делает его доступным на странице, фактически не изменяя код .htm страница - поэтому если вы просматриваете исходный код, вы увидите ссылку на код, а не сам код).
function show(i)
{
for (x in i)
{
document.write(i[x]+'\n')
}
}
Наконец - в вашем документе .htm, скажем, для вашей страницы index.htm, вы замените свой код навигации (который вы поместили в вышеупомянутый блок, называемый навигацией) следующим:
<script type="text/javascript">show(navigation);</script>
Где это имя после SHOW и в скобках - это имя вашей переменной (объявленной ранее).
У меня есть сайты, показывающие оба метода, если вы хотите их увидеть, просто отправьте мне сообщение.