如何使用John Resig JavaScript微模板引擎？

Question

我已经搜索了一些关于在Google上使用John Resig JavaScript Micro-Templating引擎的基本示例，但是干了。

我决定把它带给基地人。 任何人都可以帮助一个使用这个引擎的简单例子吗？ 我之前从未使用过客户端模板引擎。

更新：这是完整的HTML文档。 感谢Will。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>John Resig JavaScript Micro-Templating engine</title>
    <script src="jquery-1.3.2.js" type="text/javascript"></script>
    <script src="MicroTemplates.js" type="text/javascript"></script>
    <script type="text/javascript">
        //Data
        var data = { fname: "fred" };

        function onloadFunction() {
            var s = $("#biodata").html();
            var s1 = tmpl(s, data);

            $("#target").html(s1);
        }
    </script>
    <script id="biodata" type="text/html">
        <div><%= fname %></div> 
    </script> 
</head>
<body onload="onloadFunction();">
    <div id="target">
    </div>
</body>
</html>

Answer 1

您提供的链接在引擎代码后立即有一个示例。 从第2段开始阅读。

CB，使用你的例子，这是我对引擎的看法，它在div标签之间输出fname的值。 为了实现这一代，你会做一些事情：

var data = { fname : "fred" };
var generatedText = tmpl("biodata", data);

然后你必须输出它，例如。

document.write(generatedText);

或者（假设页面中存在div，其id为'elemId'）

var elem = document.getElementById("elemId");
elem.innerHTML = generatedText;

以上所有都是未经测试的，但希望是准确的。 希望能帮助到你！