HTML - Reducing html code redundancy

Question

Мне было интересно, есть ли способ сократить код HTML. В настоящее время я использую bootstrap для размещения этих веб-страниц.

Меню на моей странице повторяется на всех страницах, и если оно обновляется, вы обновляете страницу за страницей.

Есть ли способ, возможно, чтобы сократить весь HTML код ...

<div class="navbar navbar-fixed-top" role="navigation" 
    <div class="container"> 
     ... 
    </div> 
<div> 

... с помощью JavaScript или любого в любом виде пути.

Answer 1

Да - вы можете сделать это через javascript. Давайте предположим, что вы создать 1 JS файл, который вы включить во всех ваших страницах:

<script language="javascript" src="/js/mymenu.js"></script> 

Если вы используете другой JavaScript или другие CSS-файлы для вашего меню, убедитесь, чтобы включить mymenu.js файл перед другими в вашей HEAD-тег.

Тогда в вашем mymenu.js файл просто есть такой код:

var outerDiv = document.createElement("div"); 
outerDiv.setAttribute("class","navbar navbar-fixed-top"); 
outerDiv.setAttribute("role","navigation"); 
var innerDiv = document.createElement("div"); 
innerDiv.setAttribute("class","container"); 
outerDiv.appendChild(innerDiv); 
document.body.appendChild(outerDiv); 
... 

Убедитесь, что ваш CSS для главного меню использует позицию: абсолютная; или вместо того, чтобы делать body.appendChild, добавьте его в содержащий элемент.