導入網頁的常見結構

當創建一個網頁，我們經常包括在所有頁面的導航：導入網頁的常見結構

<li><a href="contact.html" class="active">Contact</a></li>

：

<nav id="nav"> 
    <ul> 
     <li><a href="about.html" class="active">About us</a></li> 
     <li><a href="services.html">Services</a></li> 
     <li><a href="contact.html">Contact</a></li> 
    </ul> 
</nav>

我們會經常只能通過積極的類別標誌的活動頁面

將整個導航複製並粘貼到所有子頁面中並不是一個好主意 - 如果我們決定添加一個新頁面，則必須更改所有子頁面上的導航欄。

我們可以把導航放入一個單獨的文件然後導入嗎？

<!-- PSEUDOCODE --> <import file="nav.html" active="About us" />

或者，也許有這個一個HTML兼容的預處理器（我想重用現有的代碼，而不是從頭開始重寫）

來源

2016-07-28 marmistrz

[在HTML文件中包含其他HTML文件]（http://stackoverflow.com/questions/8988855/include-another-html-file-in-a-html-file）或google for「html模板引擎「 – JJJ

您對如何做到這一點的幾個選項，如總是，每一個都有它的優點和缺點...

1 - 使用一個單一的Html文件。這聽起來可能很瘋狂，但取決於你的網站有多少數據，這可能是一個好的和簡單的解決方案。但它顯然不能很好地擴展，你可能會得到一個巨大的文件。使用<frame>或標籤。這是最古老的方式，它很容易實現，但它在SEF，書籤和打印方面存在一些問題。

3 - 使用Ajax（XMLHttpRequest）通過Javascript加載外部HTML。這也相對容易實現，但導航（'後退'按鈕）有一些問題，並依賴於JavaScript。

5 - 使用服務器端模板引擎。這可能需要一些努力，取決於您的服務器結構，但這不是一件很難的事情。這裏的缺點是你可能有一些額外的工作來調整你的文件模板引擎。

你也可以使用套接字來獲取你的數據，但這感覺就像用螺絲刀錘釘。

來源

2016-07-28 11:43:21 rafaelcastrocouto

導入網頁的常見結構

回答

相關問題