引用外部JavaScript模板_Javascript_Html

引用外部JavaScript模板

javascript html

引用外部JavaScript模板,javascript,html,Javascript,Html,我使用的是JavasScript模板引擎。用法非常简单：在HTML页面中，定义带有模板化HTML内容的脚本标记： <script id="myTemplate" type="text/x-jsrender"> <div>{{:name}} ({{:year}})</div> </script> ... <body> <div id="content"></div> </body> 问题是:

我使用的是JavasScript模板引擎。用法非常简单：

在HTML页面中，定义带有模板化HTML内容的脚本标记：

<script id="myTemplate" type="text/x-jsrender">
    <div>{{:name}} ({{:year}})</div>
</script>
...
<body>
<div id="content"></div>
</body>

问题是:

我不希望将模板定义保留在宿主HTML页面中，我希望将其与JavaScript文件一起保存在一个单独的文件中，这样它就可以更加模块化

我想做如下工作：

<script id="myTemplate" 
        type="text/x-jsrender" 
        src="template/myTemplate.html">
</script>

其中myTemplate.html定义了必要的html模板片段。我试过上面的代码，但不起作用。有人能提出解决问题的替代方法吗？

如果您不想使用AJAX调用，并且使用更多内存与您无关，那么我至少可以想到一种替代解决方案。AJAX可能更干净，但我想无论如何我都会把它放在那里

document.write('<script id="myTemplate" type="text/x-jsrender"><div>{{:name}} ({{:year}})</div></script>');

如果你把它放到一个外部文件中并通过

<script type="text/javascript" 
    src="template/myTemplate.js">
</script>

然后脚本会将字符串的有效脚本标记副本附加到jsrender可以实际访问的DOM中。当然，这最终会占用客户端上大约两倍的内存，但是。。。如果不是太大的文件，应该不会有问题。

浏览器不会根据type属性下载内部不支持的语言的脚本

从src属性获取URI，然后用XHR请求资源。

好的，您试过了吗？你写这个问题可能比实际尝试要花更长的时间。@TheZ:是的，我试过了，但没用。我发布这个问题是想看看是否有人可以推荐一种替代方法：-。我更新了问题以反映这一点。这是的副本。很抱歉，如果您对ajax请求感到满意，那么是的，这是一个可行的解决方案。如果您认真考虑使用微模板，我建议您使用更好的模板引擎，例如Handlebar，并对其进行预编译，从而将其转换为JS函数，并要求使用RequireJSUnrule。如果在OP中加载HTML时检查Firebug和/或Chrome Dev工具的“网络”选项卡，您将看到template/myTemplate.HTML的内容确实是由浏览器请求并通过网络传输的。由于某些原因，jsRender无法使用它们。

<script type="text/javascript" 
    src="template/myTemplate.js">
</script>