understanding Jquery template

Question

I am reading and trying to understand a Jquery template example.

Answer 1

This contains a reference to a template named "titleTemplate", a template which has not yet been defined:

<script id="movieTemplate" type="text/x-jquery-tmpl"> 
  {{tmpl "titleTemplate"}}
  <tr class="detail"><td>Director: ${Director}</td></tr>
</script>

This line defines that missing template:

$.template( "titleTemplate", "<tr class='title'><td>${Name}</td></tr>" );

It is another way of saying

<script id="titleTemplate" type="text/x-jquery-tmpl"> 
  <tr class='title'><td>${Name}</td></tr>
</script>

In essence the example shows that you can define templates in two ways

• declaratively in the HTML source code, as <script type="text/x-jquery-tmpl"> elements
• programmatically from strings through $.template()