使用underscore.js的_.template()方法填充一段html模板,可是在IE7,8下无法填充。请问该怎么解决?


最近在帮公司开发一个系统的前台页面,由于想避免用字符串拼接的办法来动态生成html,于是想到了用模板,就选择了underscore.js。

下面是演示代码,很简单,只是自定义了个数组data,然后借用underscore的模板功能用data去填充id为tpl的模板,把结果作为#container的innerHTML:


 <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" language="javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" language="javascript" src="js/underscore.js"></script>
<title></title>
</head>
<body>
    <div id="container"></div>
</body>
<script>
    $(function(){
        var data=[{name:'carl'},{name:'carl'},{name:'carl'}];
        var t=_.template($("#tpl").text());
        $("#container").html(t(data));
    });
</script>
<script type="text/template" id="tpl">
    <%_.each(obj,function(e,i){%>
    <ul>
        <li><%=e.name%></li>
    </ul>
    <%})%>
</script>
</html>

结果在FF,Chorome下输出正常,可是在IE7,8下面发现模板无法渲染,不知道是不是因为兼容性问题造成的,还是自己的写法存在问题,想请各位指点迷津。

underscore HTML JavaScript

xiaolv 10 years, 9 months ago

是因为你的这一句代码有问题 var t=_.template($("#tpl").text());
IE低版本下获取script的内容不能用text()方法,而是用html()方法

叫我工厂长 answered 10 years, 9 months ago

Your Answer