javascript - Je voudrais demander comment importer tous les fichiers CSS et JS dans un fichier HTML afin que d'autres fichiers HTML n'aient pas besoin d'être réimportés?
曾经蜡笔没有小新
曾经蜡笔没有小新 2017-06-30 09:56:18
0
7
1500

Tout comme il s'agit de mon fichier common.html, les autres fichiers HTML n'ont pas besoin d'être importés. Veuillez trouver une méthode. . . . .

    <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>
曾经蜡笔没有小新
曾经蜡笔没有小新

répondre à tous(7)
仅有的幸福

Vous pouvez uniquement référencer un fichier JS, puis charger dynamiquement le CSS à charger.

// 动态加载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");
曾经蜡笔没有小新

S'il n'y a pas de solution utilisant uniquement HTML, vous pouvez utiliser la fonction d'héritage de modèle dans le moteur de modèle de modèle. Il existe de nombreuses bibliothèques avec cette fonction. Vous pouvez essayer d'utiliser jade, qui semble avoir été renommé pug.

Héritage de modèles

三叔

Utilisez un framework pour les applications d'une seule page

洪涛

Ce que vous voulez c'est SPA, le même cadre, il suffit de changer les composants placés dans le cadre

代言

Oui, cela dépend du scénario. Les solutions pour différents scénarios sont également très différentes

曾经蜡笔没有小新

Ce qui suit est un exemple simple à titre de référence uniquement

<!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>
洪涛

Il est recommandé d'utiliser un outil d'emballage. J'ai construit un échafaudage il n'y a pas longtemps et il a cette fonction. https://github.com/JakeLaoyu/...

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal