использовать часть html-body через все страницы

Question

Возможно, название не так понятно, так как я не уверен, как это объяснить. Я создаю свой html (однократная работа, поэтому не использую java. Просто html с css). (Pic 1). Левая панель и нижний колонтитул почти такой же полный из всех страниц сайта, он содержит ссылку на другие страницы веб-сайта.

|================================| 
||-------||------------||------| | 
||LEFT ||CENTER  ||RIGHT | | 
||PANEL ||PANEL  ||PANEL | | 
||_______||____________||______| | 
||_______________________________| 
|| FOOTER      | 
||_______________________________| 
|================================| 

Рис.1 веб-страницы макета

|------------------------| 
|      | 
|link to pA    | 
|link to pB    | 
|      | 
|current link highlited | 
|------------------------| 

pic2. расположение левой панели

но с моими нынешними знаниями я должен изменить все страницы, если попытаюсь внести какие-либо изменения в левую панель и нижний колонтитул. Можно ли написать эту левую панель в отдельном файле и включить ее там, где это необходимо?

Также возможно отдельный вопрос, но связанный, предполагая, что запись левой панели в отдельный файл возможна. можно ли выделить в настоящее время посещение pagelink? (см. Pic 2)

Answer 1

EDIT Извините, я не обращал достаточного внимания. Вы не используете PHP? В этом случае взгляните на HTML5 include file

Не удалось найти способ обмена данными между главной страницей и включенным файлом. Возможно, если возможно, в вашем включенном файле вы можете использовать тег #, например. mypage.html#hello и проанализируйте его с помощью JavaScript, чтобы узнать, какую страницу вы посещаете.

---

Вы практически отвечаете на свой вопрос. Просто выньте HTML-код и поместите его в отдельный файл и включите его там, где он был первоначально.

Скажите ваш код

<div id="main"> 
    <div id="left-panel"> 
     <div id="links etc"></div> 
    </div> 
    <div id="another"></div> 
</div> 

Вы бы взять left-panel часть и поместить в отдельный файл и включить его, где он был.

left-panel.php

<div id="left-panel"> 
    <div id="links etc"></div> 
</div> 

Исходный файл

<div id="main"> 
    <?php include 'left-panel.php'; ?> 
    <div id="another"></div> 
</div> 

Чтобы узнать, какие страницы вы в настоящее время посещения можно использовать переменную. Скажем, на каждой странице, вы положили <?php $page = 'shop'; ?> и внутри left-panel.php использования if-высказывания типа:

<ul> 
    <li><a href="page1.php" <?php if($page == 'page1') echo 'class="active"'; ?>>Page1</li> 
    <li><a href="page2.php" <?php if($page == 'page2') echo 'class="active"'; ?>>Page2</li> 
</ul> 

Чтобы избежать кучу if-заявления, вы можете разместить свои страницы в массиве и петли им:

<ul> 
<?php 
$pages = array('page1' => 'Page1', 'page2' => 'Page2', 'page3' => 'Page3'); 
foreach($pages as $file => $name) { 
    echo '<li><a href="'.$file.'" '.($page == $file ? 'class="active"' : '').'>'.$name.'</a></li>'; 
} 
?>