Objaśnienie <script type = „text / template”>… </script>

Natknąłem się na coś, czego nigdy wcześniej nie widziałem. W źródle przykładowej aplikacji TODO Backbone.js ( Przykład TODO Backbone ) mieli szablony wewnątrz <script type = "text/template"></script>, które zawierały kod, który wygląda jak coś z PHP, ale ze znacznikami JavaScript.

Czy ktoś może mi to wyjaśnić? Czy to jest legalne?

Te tagi skryptowe są powszechnym sposobem implementacji funkcjonalności szablonów (jak w PHP), ale po stronie klienta.

Ustawiając typ na „tekst / szablon”, nie jest to skrypt zrozumiały dla przeglądarki, więc przeglądarka po prostu go zignoruje. Pozwala to na umieszczenie w nim wszystkiego, co można później wyodrębnić i wykorzystać w bibliotece szablonów do wygenerowania fragmentów HTML.

Backbone nie zmusza cię do korzystania z żadnej konkretnej biblioteki szablonów - jest ich całkiem sporo: Wąsy , Haml , Eco , szablon Google Closure i tak dalej (ta, której użyto w przykładzie, z którym się łączyłeś , to underscore.js ). Będą one używać własnej składni do pisania w obrębie tych znaczników skryptu.

To jest legalne i bardzo przydatne!

Spróbuj tego:

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

Kilka bibliotek szablonów JavaScript używa tej techniki. Handlebars.js jest dobrym przykładem.

Ustawiając tag skryptu typeinny niż text/javascript, przeglądarka nie będzie wykonywać wewnętrznego kodu tagu skryptu. Nazywa się to mikro szablonem. Ta koncepcja jest szeroko stosowana w aplikacji jednostronicowej (aka SPA).

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

W przypadku mikro szablonu typ znacznika skryptu to text/template. Jest to bardzo dobrze wyjaśnione przez twórcę Jquery Johna Resiga http://ejohn.org/blog/javascript-micro-templating/

Aby dodać do odpowiedzi Box9:

Backbone.js jest zależny od underscore.js, który sam implementuje oryginalne mikrotemplaty Johna Resiga.

Jeśli zdecydujesz się użyć Backbone.js z Railsami, koniecznie sprawdź klejnot Jammit. Zapewnia to bardzo czysty sposób zarządzania pakowaniem zasobów dla szablonów. http://documentcloud.github.com/jammit/#jst

Domyślnie Jammit używa również mikrotemplatów JResiga, ale pozwala także na wymianę silnika szablonów.

Jest to sposób dodawania tekstu do HTML bez renderowania lub znormalizowania.

Nie różni się niczym od dodania go w następujący sposób:

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

<script type = “text/template”> … </script>jest przestarzały. <template>Zamiast tego użyj tagu.

Szablony jQuery to przykład czegoś, co używa tej metody do przechowywania HTML, który nie będzie renderowany bezpośrednio (to jest cały punkt) wewnątrz innego HTML: http://api.jquery.com/jQuery.template/