在 javascript 中访问文本/模板内容答案

【问题标题】：Accessing text/template contents in javascript在 javascript 中访问文本/模板内容
【发布时间】：2011-06-03 21:46:23
【问题描述】：

我正在尝试访问类型设置为“文本/模板”的脚本块的 html 内容。我听说过使用此类标签的模板引擎，但我的应用程序非常简单，无需加载整个引擎。有人可以阐明我如何选择该元素吗？我认为 jQuery 的 .html() 函数会给我内容，但我似乎找不到元素。

模板如下：

<script type="text/template" id="repeating-form-section-template">
  <div class="repeating-form-section">
    <label>Field Name:</field>
    <input type="text" value="default value" name="field_name" />
  </div>
</script>

我尝试过的事情：

getElementById('repeating-form-section-template');
$('script').filter(...);
$('#repeating-form-section-template');
$("script[type='text/template']");

谢谢！

【问题讨论】：

您是否还需要模板标签方面的帮助。这是不同的，因为您需要先处理它们。
我似乎对此没有任何问题 (click here for example)。您是在 jQuery 之前加载文本/模板部分，然后是您自己的脚本，对吗？另一个小问题可能是格式错误的 HTML (<label>Field Name:</field>)。
如果它根本没有得到内容，这就是我的猜测。我也更新了答案。
加载事件后忘记触发函数；我的错。感谢您的帮助！

标签： javascript jquery templates

【解决方案1】：

两者：

 $('#repeating-form-section-template');
 $("script[type='text/template']");

工作正常。确保在 DOM 加载后检查它们。例子： http://jsfiddle.net/niklasvh/VKqPX/

【讨论】：

谢谢，DOM 加载后我没有加载脚本。

【解决方案2】：

应该这么简单：

http://jsbin.com/evozi5/edit

预览： http://jsbin.com/evozi5/

代码很简单：

var someVar = $('#repeating-form-section-template').html();

$('#where-i-want-content').append(someVar);

注意

jQuery 必须在之前加载 这将起作用。所以：

<script src="jquery.js"></script>
<script> /* your code */ </script>
<script type="text/template"></script>

【讨论】：

【解决方案3】：

innerHTML 通常被认为是不好用的东西，但在这里使用它是完美的东西：

var template = document.getElementById("repeating-form-section-template").innerHTML;

document.getElementById('where-you-want-the-content').innerHTML = template;

【讨论】：