2017-02-13 3 views
0

Ich habe statische HTML-Dateien, jedes sieht wie folgt aus.Wie lade ich eine externe Datei aus einem HTML heraus?

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
    <style type="text/css"> 
    p { 
     width: 100px; 
    } 
    </style> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
    <script> 
     $(function() { 
      $("#accordion").accordion(); 
     }); 
    </script> 
</head> 
<body> 
    <div id="accordion"> 
     <h1>Chapter 1</h1> 
     <p>dul tank ksk sk skek kejk jk sk sksjk sdsfkdsfs ai nvnei kdsfue v sjksfspas ksdsjkfs fsakd;afksajf;akd fa</p> 
     <h1>Chapter 2</h1> 
     <p>dul tank ksk sk skek kejk jk sk sksjk sdsfkdsfs ai nvnei kdsfue v sjksfspas ksdsjkfs fsakd;afksajf;akd fa</p> 
    </div> 
</body> 
</html> 

Da

<meta charset="utf-8" /> 
    <style type="text/css"> 
    p { 
     width: 100px; 
    } 
    </style> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
    <script> 
     $(function() { 
      $("#accordion").accordion(); 
     }); 
    </script> 

der gemeinsame Code ist, möchte ich es extrahieren und in eine neue Datei mit dem Namen common.html.

Frage

Ich versuche Last common.html mit link Tag, aber es erzeugt eine merkwürdige Ausgabe.

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
    <link rel="import" href="common.html"/> 
</head> 
<body> 
    <div id="accordion"> 
     <h1>Chapter 1</h1> 
     <p>dul tank ksk sk skek kejk jk sk sksjk sdsfkdsfs ai nvnei kdsfue v sjksfspas ksdsjkfs fsakd;afksajf;akd fa</p> 
     <h1>Chapter 2</h1> 
     <p>dul tank ksk sk skek kejk jk sk sksjk sdsfkdsfs ai nvnei kdsfue v sjksfspas ksdsjkfs fsakd;afksajf;akd fa</p> 
    </div> 
</body> 
</html> 

Was ist der richtige Weg zu laden?

Antwort

3

Sie können HTML-Code nicht einfach einbinden, indem Sie ihn auf diese Weise verknüpfen.

Wenn Sie eine Template-Engine, um Ihre Website Verwaltung entweder gehen für einen flachen Website-Generator wie Jekyll, verwenden Sie einen Rahmen wie Ruby on Rails oder Symfony oder rollen Sie Ihren eigenen (mit PHP, zum Beispiel).

+1

Ich muss statische HTML-Dateien verwenden. –

+0

Dann ist Jekyll ein guter Weg zu gehen. Überprüfen Sie ihre Templating-Funktion [hier] (https://jekyllrb.com/docs/templates/). –

+0

Hey, @SingleFighter, hast du Glück dabei? Hast du dich am Ende mit einer bestimmten Technologie begnügt? –

1

Check out Jekyll. Es ist ein statischer Webseitengenerator.

Verwandte Themen