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. [C程序设计语言]第四部分

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  2. C# 获取打印机列表以及串口

    C# 获取打印机列表以及默认打印机.串口列表. /// <summary> /// 获取本地已安装的打印机 /// </summary> /// <returns> ...

  3. CUBRID学习笔记 10 数据库文件的类型和含义

    demodb contains the database data; demodb_lgar000, 001 and so forth are log archives used for point ...

  4. Nginx基础知识之——配置文件信息(检查配置文件是否正确)

    一.检查配置文件是否正确: /usr/local/sbin/nginx -t -c /usr/local/nginx/conf/nginx.conf 检查结果: nginx: [emerg] ngin ...

  5. linux学习笔记2-命令总结3

    文件搜索命令 1.文件搜索命令 find 2.其他文件搜索命令 grep - 在文件中搜索字串匹配的行并输出 locate - 在文件资料库中查找文件 whereis - 搜索命令所在目录及帮助文档路 ...

  6. 08 高效的SQL

    编写高效 SQL 需要以下知识 有关所查询内容的物理组织的知识 数据库能做什么的知识, 例如: 如果你不知道跳跃扫描索引及其用途, 那么你可能会看着模式说”索引丢了” SQL 所有错综复杂的知识 对目 ...

  7. 手机CPU知识扫盲:谈谈手机CPU架构与原理 (全

    CPU是手机上面最复杂,最贵的Soc(芯片),担任的也是手机中大脑的位 置,是手机跑分性能的决定性硬件.智能手机发展到今天,各大手机CPU厂商也从春秋战国逐渐到了现在四国鼎立的时代(高通,MTK,三星 ...

  8. JAVA 程序设置运行内存

    1.修改jdk设置 2.如果不行则 一般安装完eclipse之后,在安装目录下你应该可以看到有一个 eclipse.ini 文件,对了,就是在这个文件里面修改 -vmargs:说明后面是VM的参数 - ...

  9. D3.js 力导向图的制作

    力导向图中每一个节点都受到力的作用而运动,这种是一种非常绚丽的图表. 力导向图(Force-Directed Graph),是绘图的一种算法.在二维或三维空间里配置节点,节点之间用线连接,称为连线. ...

  10. C#_DataTable导出Execl为自定义标题

    public bool ExportExcel(DataTable tb, string path, string tbName) { //excel 2003格式 string connString ...