具有“div”的把手模板标记而不是“脚本” [英] Handlebars template with "div" tag instead "script"

问题描述

实际上，问题出在subj ...
是否有可能使句柄模板框架，识别div标签内的模板而不是脚本标记？

例如，我想用这个标记创建模板：

 < style> 
 div.text-x-handlebars {display：none;} 
< / style> 
< div class =text-x-handlebars-template> 
< h2>我是模板< / h2> 
< p> {{welcomeMessage}}< / p> 
< / div> 
  

解决方案

是的，您可以将模板放在< div> s而不是< script> s，例如：

http://jsfiddle.net/ambiguous/RucqP/

然而，这样做充满危险。如果您将模板放入< div> 中，则浏览器会在您填充之前将其解释为HTML ;因此，如果您的模板的HTML在 填充之后无效，那么浏览器可能会尝试对其进行更正并将其混淆。此外，如果您的模板中包含 id 属性，那么您将以重复的 id s结尾模板< div> ，然后在填充模板中重复放入DOM），这会导致各种奇怪而有趣的错误。浏览器也会尝试在< div> 中下载模板中的任何图像，这可能是也可能不是问题（如果甚至可能是可取的，但可能不可取如果图片在其 src 属性中使用模板变量）。

基本上，你可以这样做，但你不应该't，您应该将模板放在< script id =...type =text / x-handlebars-template> 元素中。 p>

Actually the question is in the subj... Is it possible to make handlebars template framework, to recognize templates within a div tag and not in script tag?

For example I would like to create template with this markup:

<style>
    div.text-x-handlebars {display:none;}
</style>
<div class="text-x-handlebars-template">
    <h2>I'm template</h2>
    <p>{{welcomeMessage}}</p>
</div>

解决方案

Yes you can put your templates in <div>s rather than <script>s, for example:

http://jsfiddle.net/ambiguous/RucqP/

However, doing so is fraught with danger. If you put your template inside a <div> then the browser will interpret it as HTML before you've filled it in; so, if your template's HTML isn't valid until after it has been filled in, the browser may attempt to correct it and make a mess of things. Also, if you have id attributes in your templates, then you will end up with duplicate ids (one in the template <div> and a repeat in the filled in template that you put in the DOM) and that will cause all sorts of strange and interesting bugs. The browser will also try to download any images inside the templates in a <div>, this may or may not be a problem (if might even be desirable but probably not desirable if the image uses a template variable in its src attribute).

Basically, you can do it but you shouldn't, you should put your templates in <script id="..." type="text/x-handlebars-template"> elements instead.

这篇关于具有“div”的把手模板标记而不是“脚本”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！