javascript - 下划线代码在网页上不显示任何内容

标签 javascript html underscore.js

我是下划线初学者,此代码片段显示空白网页而不是模板。所以如果有人能帮助我,我会很有帮助:)

总结.html

<html>
<head>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <meta charset="utf-8">
</head>
<body>

    <div class="tangent"></div>
      <script type="text/template" id="temp">
    <h1><%= head %></h1>
    </script>

    <script type ="text/javascript" id="tem">
        var head = "hii";
        //var head2 = "hello";

        var templ = $('#temp').html() ;
        $('#tagent').html(_.template(templ,{head:head}));        
    </script>
</body>

在我的 mozilla 上运行它,控制台显示这些消息 获取 http://localhost/summa.html [HTTP/1.1 304 未修改 5ms] 得到 http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js [HTTP/1.1 304 未修改 232ms] 得到 http://code.jquery.com/jquery-latest.min.js [HTTP/1.1 304 未修改 556ms] 我用谷歌搜索,我知道这不是错误消息或问题。那么我犯错的地方是什么? 提前谢谢你

最佳答案

有些地方你做错了。

首先,您必须将模板 html 传递给 _.template 并将其分配给一个变量。此变量存储对函数的引用,然后您调用它传递 {head:head} 作为参数。最后,您尝试通过 id(使用 #)选择您的 tangent div。由于您只定义了该元素的类,因此您应该使用 . 选择它。

我想这就是您要找的:

<html>
<head>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <meta charset="utf-8">
</head>
<body>

    <div class="tangent"></div>
      <script type="text/template" id="temp">
    <h1><%= head %></h1>
    </script>

    <script type="text/javascript" id="tem">
        var head = "hii";
        //var head2 = "hello";

        var templ = $('#temp').html();
        var template = _.template(templ);
        $('.tangent').html(template({head:head}));
    </script>
</body>

关于javascript - 下划线代码在网页上不显示任何内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34726559/

相关文章:

javascript - 什么时候使用 _.bind 与 _.bindAll?

javascript - 提交表单时如何从多选中获取数组[AngularJS]

javascript - 贝塞尔曲线控制点方向 d3

html - 如何在下拉 CSS 列表中显示缩略图以及其他文本样式

javascript - Angular2 中的输入只允许一位小数

html - 如何在菜单项周围创建 'Drawn' 样式线

javascript - 为什么我不能将 Backbone.Collection 用作通用集合?是否有执行此操作的实现?

javascript - 根据数据属性向元素添加类

javascript - chart.js 线图 : Fill area above line as opposed to below and to the right

javascript - 有没有更有效的方法来查找返回对象的子集?