正確地將外部標記加載到多個頁面中
[英]Properly load external markup into multiple pages
問題描述
我正在處理必需的靜態頁面分配。 （不是我的選擇）
我有一個導航，我想將其用於數十個靜態html文件。
我正在通過jQuery / javascript獲取標記
$(function () {
// get navigation menu
$.get('nav.html', function (data) {
$('.navigation').replaceWith(data);
});
});
事情開始變得時髦了
我要加載到多個頁面中的標記是這樣的：我不添加body標簽，因為這樣的想法是將這些內容加載到現有的HTML頁面中。
nav.html
<ul>
<li><a href="">Home</a></li>
<li><a href="">News</a></li>
<li><a href="">Contact</a></li>
<li><a href="">About</a></li>
</ul>
我的問題是沒有加載應用於nav.html的樣式。 然后，為了將css樣式導入nav.html我添加了一個head標簽，它聞起來像是一種非常不好的做法，因此我在這里尋求指導。
nav.html （帶有head標簽）
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="xlib/bootstrap/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="app.css" />
<link rel="stylesheet" type="text/css" href="nav.css" />
</head>
<ul>
<li><a href="">Home</a></li>
<li><a href="">News</a></li>
<li><a href="">Contact</a></li>
<li><a href="">About</a></li>
</ul>
將同一HTML標記加載到多個頁面中，同時異步進行並獲取同一HTML標記的所有所需樣式的最佳實踐是什么？
1 個解決方案
解決方案1
0 2018-03-03 22:26:33
盡管“最佳實踐”可能是客觀的，而且還是有意見的，但是我一直在使用靜態和非靜態網頁，對我來說，似乎最有意義，最干凈的實現方式是使用通用的CSS文件可以在所需的每個頁面的主要html文件的開頭添加。
如果您希望基於不同的功能區域來組織文件，以便擁有匹配的nav.html和nav.css（甚至是nav.js）文件，我會考慮使用捆綁工具來生成通用的CSS文件（甚至是通用js）文件）。 使用的捆綁軟件工具取決於您用來構成網站的技術。
希望這對您有所幫助，如果您想要更多詳細信息，請告訴我。
將外部導航欄加載到多個html頁面中
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.