- Gemeinschaft
- Lernen
- Tools-Bibliothek
- Freizeit
Heim > Fragen und Antworten > Hauptteil
So wie dies meine common.html ist, müssen keine anderen HTML-Dateien importiert werden. Bitte finden Sie eine Methode. . . . .
<meta name="description" content="Dashboard" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--Basic Styles-->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" />
<link id="bootstrap-rtl-link" href="" rel="stylesheet" />
<link href="assets/css/font-awesome.min.css" rel="stylesheet" />
<link href="assets/css/weather-icons.min.css" rel="stylesheet" />
<!--Fonts-->
<link href="assets/css/fonts-google.css" type="text/css" rel="stylesheet">
<!--Beyond styles-->
<link id="beyond-link" href="assets/css/beyond.min.css" rel="stylesheet" type="text/css" />
<link href="assets/css/demo.min.css" rel="stylesheet" />
<link href="assets/css/typicons.min.css" rel="stylesheet" />
<link href="assets/css/animate.min.css" rel="stylesheet" />
<link id="skin-link" href="" rel="stylesheet" type="text/css" />
<!--Page Related styles-->
<link href="assets/css/dataTables.bootstrap.css" rel="stylesheet" />
<!--Skin Script: Place this script in head to load scripts for skins and rtl support-->
<script src="assets/js/skins.min.js"></script>
仅有的幸福2017-06-30 09:58:18
可以只引用一个 JS 文件，然后把要加载的 CSS 做动态的加载。
// 动态加载js脚本文件
function loadCss(url) {
var link = document.createElement("link");
link.type = "text/css";
link.rel = "stylesheet";
link.href = url;
document.getElementsByTagName("head")[0].appendChild(link);
}
// 测试
loadCss("assets/css/dataTables.bootstrap.css");曾经蜡笔没有小新2017-06-30 09:58:18
如果只用html是没有办法的，可以借助template模板引擎中的模板继承功能实现，具有该功能的库比较多，可以尝试用jade，现在好像改名叫pug了。
模板继承
曾经蜡笔没有小新2017-06-30 09:58:18
下面一个简单的例子，仅供参考
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>测试页面</title>
</head>
<body>
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
var headHTML = $('head').html();//保存原来的head内容
$("head").load("common.html",function(){
$(this).prepend(headHTML); //common.html载入到head后将原来head内容添加回去
});
</script>
</body>
</html>