2016-03-27 17 views
4

Gibt es eine Möglichkeit, HTML-Inhalt zu minimieren?Minimieren von HTML-Inhalt

Zum Beispiel lassen Sie uns sagen, dass ich ein reguläres HTML-Dokument haben, wie:

<html> 


<title>A title or something</title> 

    <h2>Blah blah blah times 5 </h2> 
    <p> 
    Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5Blah blah blah times 5 
    </p> 


</html> 

Ich würde lieber, wenn möglich, so etwas tun:

<html> 


<title>{title of page}</title> 

    <h2>{header information}</h2> 
    <p> 
{Paragraph information} 
    </p> 


</html> 

Ich bin nicht sicher, wie die html Seite würde wissen, dass es diese Informationen bekommt, aber ich schaue nur, ob das möglich ist oder nicht.

Antwort

8

Sie möchten wahrscheinlich eine Waage verwenden ry wie Handlebars. Es gibt auch andere ähnliche Bibliotheken da draußen, also achte darauf, das Beste für dich zu finden.

Lenker können Sie das {{something}} Format verwenden, um die Informationen zu minimieren, die Sie in Ihren HTML Code schreiben. Andere werden ein ähnliches, wenn nicht das gleiche Format verwenden.

Aufbauend auf, dass, können Sie auch Schalter einen MVC-Framework (wie Angular oder Ember) verwendet, die ähnlich „Schnurrbart“ Stil Templating und andere hilfreiche Funktionen enthalten, um Ihre dynamischen Inhalte leichten Code zu machen. Ember verwendet tatsächlich Lenker, Angular verwendet eigene "Direktiven", die sehr ähnlich sind. Andere MVC-Frameworks mit enthaltenem Template sind ebenfalls verfügbar.

+0

Ok, werde danke tun. – Snorlax

2

Sie fragen grundsätzlich nach einer Art UI-Vorlagen-Framework. Es ist möglich zu tun, es kann serverseitig oder clientseitig erfolgen, jede hat ihre Vor- und Nachteile.

Da Sie die Frage mit javascript und jquery hier sind ein paar clientseitige Templating Frameworks markiert, die Sie nützlich finden können:

Werfen Sie auch einen Blick auf Template Engine Chooser

+0

Selbst gute altmodische Strich könnte hier auch funktionieren ??? –

0

Was möchten Sie verwenden, um Ihren HTML-Code zu füllen? Normalerweise verwende ich

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title></title> <link rel="stylesheet" href=""> </head> <body> <h1>{{jsonResponse.whatever}}</h1> </body> </html>

als meine minimalen Aufschlag mit zu beginnen und haben dann Winkelfüllung in den Rest, wo nötig.

0

Oder Sie können JavaScript verwenden Inhalte zu platzieren programmatisch

document.getElementsByTagName('title')[0].innerHTML = 'title of page'; 
 
document.getElementsByTagName('h2')[0].innerHTML = 'header information'; 
 
document.getElementsByTagName('p')[0].innerHTML = 'Paragraph information';
<html> 
 
    <title></title> 
 
    <h2></h2> 
 
    <p></p> 
 
</html>

+0

Danke, gibt es einen Nachteil gegenüber dem, was andere Leute wie Lenker und eckig vorgeschlagen haben? – Snorlax

+0

Dies ist reines JavaScript, während andere Bibliothek sind. – Munawir