非常简单的Javascript模板_Javascript_Templates

非常简单的Javascript模板

javascript templates

非常简单的Javascript模板,javascript,templates,Javascript,Templates,有人能告诉我一个提供基本HTML模板的库吗也就是说，我所需要的是一个库，它可以将占位符转换为HTML中的文本值。例如，假设我有以下标记： <!DOCTYPE html> <html> <head> <title>My Title</title> </head> <body> <label>My Label:</label>

有人能告诉我一个提供基本HTML模板的库吗

也就是说，我所需要的是一个库，它可以将占位符转换为HTML中的文本值。例如，假设我有以下标记：

<!DOCTYPE html>
<html>
    <head>
        <title>My Title</title>
    </head>
    <body>
        <label>My Label:</label>

        <div>
            <label>Name:</label>
            <input placeholder="Enter name..." />
        </div>
    </body>
</html>


我的头衔
我的标签：
姓名：

我想要的是在我的标记中标记一些占位符，理想情况下，在简化视图中，这些占位符指向一个javascript变量

<!DOCTYPE html>
<html>
    <head>
        <title>{{myApp.labels.title}}</title>

        <script>
            (function () {
                window.myApp = {
                    labels: {
                        title: 'My Title',
                        label1: 'My Label',
                        name1: 'Name',
                        placeholder: 'Enter name'
                    }
                };
            }());
        </script>
    </head>
    <body>
        <label>{{myApps.labels.label1}}:</label>

        <div>
            <label>{{myApps.labels.name1}}:</label>
            <input placeholder="{{myApps.labels.placeholder}}..." />
        </div>
    </body>
</html>


{{myApp.labels.title}
（功能（）{
window.myApp={
标签：{
标题：“我的标题”，
标签1:‘我的标签’，
名称1:'名称'，
占位符：“输入名称”
}
};
}());
{{myApps.label1}}
{{myApps.labels.name1}：

我看过handlebar.js和Mustache.js等库，但它们都是：

暗示你想要的加价与模型紧密相连

使用JavaScript将一段标记绑定到各自的变量

因此，有什么更简单的（如果我写的有意义的话）吗？非常感谢。

您只需推出自己的：

function tmpl (markup, tmplvars, prefix) {
    for(var key in tmplvars) {
        if (tmplvars[key] instanceof Object)
            markup = tmpl(markup, tmplvars[key], prefix ? (prefix + "." + key) : key);
        else
            markup = markup.replace(new RegExp("\{\{" + (prefix? (prefix + "." + key) : key) + "\}\}", "gi"), tmplvars[key]);
    }
    return markup;
}

并像这样使用它：

var MyTemplate = '<label>{{username.label}}<input placeholder="{{username.placeholder}}"/></label>';
var markup = tmpl(MyTemplate, {username:{label: "Username", placeholder: "Enter your username..."}});

var MyTemplate='{{username.label}}'；
var markup=tmpl（MyTemplate，{username:{label:“username”，占位符：“输入您的用户名…”}）；

谢谢！我甚至没有意识到有一个名为tmpl的函数：）是的，这可能是因为没有这样的函数。它的定义在上面的片段中。哦，耶-哈！不知道我是怎么错过的：）但不管怎样，都很有用-谢谢。那么把它作为答案怎么样？；）