template模版与Underscore.js

在项目中经常使用的模版是Underscore这个js框架的实用功能。

在html里面设定模板,然后js绑定数据,这样能避免在js中出现非常多的html标签,在项目中表格标签用的比较多,用于追加数据,静态表格tr条数的增加。

例如:定义一个表格行模版

  通过js绑定数据,追加到表格尾,实现静态增加数据。

1:获取渲染元素和模板内容:$("#trtemplate").html()

2:解析模板, 返回解析后的内容:n = _.template($("#trtemplate").html()); n(mod.toJSON())-->生成新数据行,可追加到行尾或覆盖。

template模版与Underscore.js的更多相关文章

  1. 学习在requirejs下如何使用underscore.js模板

    近期在学习underscore.js 这个小而美的js库,是前端 MVC 框架backbone依赖库,他的模板方法主要应用场景是ajax交互过程到页面需要大量的字符串拼接,这部分如果一旦不够仔细就很容 ...

  2. 新手入门Underscore.js 中文(template)

    Underscore.js是一个很精干的库,压缩后只有4KB.它提供了几十种函数式编程的方法,弥补了标准库的不足,大大方便了javaScript的编程.MVC框架Backbone.js就将这个库作为自 ...

  3. 使用Underscore.js的template将Backbone.js的js代码和html代码分离

    这段时间在学习Require.js和Backbone.js的过程中,发现有些项目里的HTML代码都是写在View的js代码里面的,渲染的时候需要对Collection进行循环,再将HTML代码拼接上去 ...

  4. 前端笔记之JavaScript面向对象(三)初识ES6&underscore.js&EChart.js&设计模式&贪吃蛇开发

    一.ES6语法 ES6中对数组新增了几个函数:map().filter().reduce() ES5新增的forEach(). 都是一些语法糖. 1.1 forEach()遍历数组 forEach() ...

  5. Underscore.js

    概述 Underscore.js是一个很精干的库,压缩后只有4KB.它提供了几十种函数式编程的方法,弥补了标准库的不足,大大方便了JavaScript的编程.MVC框架Backbone.js就将这个库 ...

  6. (2)Underscore.js常用方法

    目录 1.集合相关方法        1.1.数组的处理                map(循环,有返回值),将返回的值依次存入一个新的数组                each(循环,无返回值 ...

  7. (1)Underscore.js入门

    1. Underscore对象封装 Underscore并没有在原生的JavaScript对象原型中进行扩展,而是像jQuery一样,将数据封装在一个自定义对象中(下文中称"Undersco ...

  8. underscore.js框架使用

    Underscore.js是一个很精干的库,压缩后只有4KB.它提供了几十种函数式编程的方法,弥补了标准库的不足,大大方便了JavaScript的编程.MVC框架Backbone.js就将这个库作为自 ...

  9. Underscore.js 的模板功能介绍与应用

    Underscore是一个非常实用的JavaScript库,提供许多编程时需要的功能的支持,他在不扩展任何JavaScript的原生对象的情况下提供很多实用的功能,需要了解的朋友可以详细参考下   U ...

随机推荐

  1. 读取视屏文件,保存帧图片为ppm文件

    ffmpeg跟sdl的学习过程:一.版本信息:ffmpeg-3.0.2.tar.bz2SDL2-2.0.4.tar.gz二.编译过程:1.ffmgeg的编译:./configure --enable- ...

  2. Spring与其他Web框架集成

    Spring与多种流行Web应用框架(Struts.JSF和DWR)集成的方法. Spring强大的IoC容器和企业支持特性使其十分适于实现Java EE应用的服务和持续层. 对于表现层,可以在许多不 ...

  3. 【Asp.Net使用EasyUI】EasyUI combox实现联动

    很多时候都会用到combox的联动效果,选择上一个combox的值就自动带出这个值对应的其它信息,比如省市联动,最近我也刚好遇到了类似的要求,是用EasyUI  combobox 控件完成的,如果是A ...

  4. POJ 1142 Smith Numbers(史密斯数)

    Description 题目描述 While skimming his phone directory in 1982, Albert Wilansky, a mathematician of Leh ...

  5. 在ubuntu上配置apue的运行环境

    http://www.apuebook.com/code3e.html 在上面的网站下载代码包,解压得到源码 sudo apt-get install libbsd-dev 安装这个支持,在解压包的m ...

  6. Nemerle Quick Guide

    This is a quick guide covering nearly all of Nemerle's features. It should be especially useful to a ...

  7. Scrum Meeting--Twelve(2015-11-3)

    今日已完成任务和明日要做的任务 姓名 今日已完成任务 今日时间 明日计划完成任务 估计用时 董元财 服务器修改与优化 5h 服务器修改与优化 4h 胡亚坤 客户端数据更新 2h 客户端意见反馈收集 2 ...

  8. Python学习(9)列表

    目录 Python 列表 访问列表中的值 更新列表 删除列表元素 列表脚本操作符 列表截取 列表函数&方法 Python 列表(List) 序列是Python中最基本的数据结构.序列中的每个元 ...

  9. 在VNC中Xfce4中Tab键失效的解决方法

    说明 在Ubuntu Server 14.04上安装了xfce4桌面环境,但是却发现在终端中Tab键不能自动补齐(但是Ctrl + I 仍然可以用). 出现这种情况的原因是,由于Tab键的功能被窗口快 ...

  10. 利用ADO.NET导出大批量数据

    2015年12月,XX项目中需要做一个数据导出功能,当时所有页面的到处功能均已经实现,但有个页面数据量太大,导出过程中导出页面直接卡死.不得已我准备选用ADO.NET来重新完成这个功能,因为考虑到越偏 ...