Javascript _下划线模板-从外部文件加载模板

关于如何加载模板以进行渲染，我已经看到了一些冗长的答案，如_下划线模板实用程序等。我在下面得到的结果很有用：

$.ajax({
    url: 'template.tmp',
    type: 'get',
    success: function(data) {
        $('html').append(data);
    }
});

代码位于jquery加载之后，但位于使用模板的任何脚本之前。这样可以吗？或者有没有理由认为这样加载模板不是一个好主意？templates.tmp文件中包含模板

<script type="text/template" id="tmpId"></script>

---

标签。它们似乎很快就被加载到DOM中。我准备为这个实现受到批评，但我只想知道为什么。如果调用“error:”而不是“success:”，我唯一能想到的可能就是一些处理。Thx.

我决定开发自己的基于OO的解决方案。这是构造器：

var TemplateLoader = function(templatePath) {
    this.template = templatePath;
    this.loaded = false;
    this.error = false;
}

方法如下：

TemplateLoader.prototype.setReady = function (state) {
    this.loaded = state;
}
TemplateLoader.prototype.setError = function (state) {
    this.error = state;
}
TemplateLoader.prototype.isReady = function () {
    return this.loaded;
}
TemplateLoader.prototype.isError = function () {
    return this.error;
}
TemplateLoader.prototype.loadTemplate = function() {
        templateLoader = this;
        $.ajax({
            url: this.template,
            type: 'get',
            success: function(data) {
                $('html').append(data);
                templateLoader.setReady(true);
            },
            error: function() {
                templateLoader.setError(true);
            }
        });
}

这就是如何使用它：

templateLoader = new TemplateLoader('template.tmpl');
templateLoader.loadTemplate();

要检查模板是否已加载，请执行以下操作：

templateLoader.isReady() //true for loaded
templateLoader.isError() //true for error loading template, eg. template doesn't exist

---

再一次，我非常感谢任何人对这段代码中出现的问题的反馈。检查附加到HTML的DOM对象怎么样。值得吗？

因为

$.ajax（）

是异步的，所以您可能会遇到这样的情况，即使用这些模板的代码在将模板加载到DOM之前就已经运行了。还有，为什么不首先在主HTML中包含模板？@robertklep我想我可以先用setInterval检查与模板相关的函数中的元素，以检查它们是否在DOM中，所以现在代码开始变长。这是一个非常有效的观点，但应该检查。至于原因。我到处都在读模块化方法是最佳实践。嗯，模块化方法是值得推荐的，但是，一旦您必须开始使用

setInterval

检查DOM中模板的可用性，您应该想知道在这个用例中这是否是正确的方法：）也许呈现模板的代码可能需要加载它们（如果需要重复呈现模板，请将它们存储在某个地方）？也许吧。如果我知道它们很可能会被使用，那么提前异步加载它们并检查它们的存在对用户来说会更容易。没错，这就是为什么我会选择将它们包含在HTML中的原因：）