当前位置: 代码迷 >> Web前端 >> underscore根本用法
  详细解决方案

underscore根本用法

热度:583   发布时间:2013-11-08 17:52:14.0
underscore基本用法

<div id="result">

</div>

<!-- 导入underscore库 -->

<script type="text/javascript" src="js/underscore.js"></script>

<!-- 设置模板 -->

<script id="template_result" type="text/template">

{{

??? _.each(dataList,function(item){

}}

<p>{%=item.name%}</p>

{{

??? });

}}

</script>

?

<script type="text/javascript">

???????????? // 设置模板解析规则
?? ??? ??? ?_.templateSettings = {
?? ??? ??? ??? ?evaluate:/\{%([\s\S]+?)%\}/g, // {%=val%} 获取变量用法
?? ??? ??? ??? ?interpolate : /\{\{\:(.+?)\}\}/g?? // {{表达式}} 表达式用法
?? ??? ??? ?};

?????????? var dataList = [

???????????? {name:"john"},

???????????? {name:"tom"}

?????????? ];

?????????? // 根据数据填充模板并返回结果HTML

?????????? var resultHTML = _.template($("#template_result").html(), dataList);

?????????? // 将返回结果填充到页面

?????????? $('#result').html(resultHTML);

</script>

  相关解决方案