Erläuterung von <script type = “text / template”>… </ script>

Ich bin gerade auf etwas gestoßen, das ich noch nie gesehen habe. In der Quelle der Backbone.js-Beispiel-TODO-Anwendung ( Backbone TODO-Beispiel ) hatten sie ihre Vorlagen in einem <script type = "text/template"></script>, der Code enthielt, der wie etwas aus PHP aussieht, aber JavaScript-Tags enthält.

Kann mir das jemand erklären? Ist das legitim?

Diese Skript-Tags sind eine übliche Methode zum Implementieren von Vorlagenfunktionen (wie in PHP), jedoch auf der Clientseite.

Wenn Sie den Typ auf "Text / Vorlage" setzen, ist dies kein Skript, das der Browser verstehen kann, und der Browser ignoriert es einfach. Auf diese Weise können Sie alles dort einfügen, was später extrahiert und von einer Vorlagenbibliothek zum Generieren von HTML-Snippets verwendet werden kann.

Backbone zwingt Sie nicht dazu, eine bestimmte Vorlagenbibliothek zu verwenden - es gibt einige: Schnurrbart , Haml , Eco , Google Closure-Vorlage usw. (die in dem Beispiel, mit dem Sie verlinkt haben, ist underscore.js ). Diese verwenden ihre eigene Syntax, damit Sie in diese Skript-Tags schreiben können.

Es ist echt und sehr praktisch!

Versuche dies:

<script id="hello" type="text/template">
  Hello world
</script>
<script>
  alert($('#hello').html());
</script>

Mehrere Javascript-Vorlagenbibliotheken verwenden diese Technik. Handlebars.js ist ein gutes Beispiel.

Wenn Sie ein typeanderes Skript-Tag als text/javascriptfestlegen, führt der Browser den internen Code des Skript-Tags nicht aus. Dies wird als Mikroschablone bezeichnet. Dieses Konzept wird häufig in Einzelseitenanwendungen (auch bekannt als SPA) verwendet.

<script type="text/template">I am a Micro template. 
  I am going to make your web page faster.</script>

Bei einer Mikrovorlage lautet der Typ des Skript-Tags text/template. Es ist sehr gut von JQuery Schöpfer John Resig erklärt http://ejohn.org/blog/javascript-micro-templating/

So fügen Sie die Antwort von Box9 hinzu:

Backbone.js ist abhängig von underscore.js, das selbst die ursprünglichen Mikrotemplates von John Resig implementiert.

Wenn Sie Backbone.js mit Rails verwenden möchten, sollten Sie sich unbedingt das Juwel Jammit ansehen. Es bietet eine sehr saubere Möglichkeit, die Asset-Verpackung für Vorlagen zu verwalten. http://documentcloud.github.com/jammit/#jst

Standardmäßig verwendet Jammit auch die Mikrotemplates von JResig, aber Sie können auch die Template-Engine ersetzen.

Auf diese Weise können Sie HTML Text hinzufügen, ohne ihn zu rendern oder zu normalisieren.

Es ist nicht anders als das Hinzufügen wie folgt:

 <textarea style="display:none"><span>{{name}}</span></textarea>

<script type = “text/template”> … </script>ist obsolet. Verwenden Sie <template>stattdessen das Tag.

jQuery Templates ist ein Beispiel für etwas, das diese Methode verwendet, um HTML zu speichern, das nicht direkt (das ist der springende Punkt) in anderem HTML gerendert wird: http://api.jquery.com/jQuery.template/