js 简单模板引擎

佚名 7年前 (2019-05-08) 随笔 1073人围观抢沙发百度已收录

代码

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>js简单模板引擎</title>
    <meta charset="utf-8" />
    <script src="Scripts/jquery-1.8.3.js"></script>
    <script src="Scripts/template-simple.js"></script>
    <script id="test" type="text/html">
        {{each list as item}}
        <tr>
            <td>{{item.name}}</td>
            <td>{{item.url}}</td>
        <tr>
            {{/each}}
    </script>
    <script type="text/javascript">
        $(function () {
            var data = [{ name: "百度", url: "www.baidu.com" }, { name: "博客园", url: "www.cnblogs.com" }];
            var html = template("test", { list: data });
            alert(html);
            $("#t1").html(html); 
        });
    </script>
</head>
<body>
    <table id="t1"></table>
</body>
</html>