text/x-jquery-tmpl 嵌套

text/x-jquery-tmpl 是一个 jQuery 模板插件，可以用于生成 HTML 代码。在模板中嵌套另一个模板可以让我们更加灵活地构建复杂的页面。

下面是一个简单的示例，其中包含一个外部模板和一个内部模板：

<script id="outerTemplate" type="text/x-jquery-tmpl">
  <div>
    <h2>${title}</h2>
    {{tmpl(items) "#innerTemplate"}}
  </div>
</script>

<script id="innerTemplate" type="text/x-jquery-tmpl">
  <ul>
    {{each(i, item) items}}
      <li>${item}</li>
    {{/each}}
  </ul>
</script>

在外部模板中，我们使用 `{{tmpl}}` 指令将内部模板应用于 `items` 数组。在内部模板中，我们使用 `{{each}}` 指令循环遍历 `items` 数组并生成列表项。

要使用这些模板，我们可以在 JavaScript 代码中先编译它们，然后将数据应用于外部模板：

var outerTpl = $.template($("#outerTemplate"));
var innerTpl = $.template($("#innerTemplate"));

var data = {
  title: "My List",
  items: ["Item 1", "Item 2", "Item 3"]
};

var html = outerTpl(data);
$("#myList").html(html);

在这个例子中，我们先编译了外部模板和内部模板，然后将数据应用于外部模板并将生成的 HTML 添加到页面中。

注意，在使用嵌套模板时，内部模板的 ID 必须以 `#` 开头，以告诉 jQuery 模板插件使用另一个模板作为子模板。