node.js开发笔记之EXPRESS与EJS之ejs标签v20140329
本次记录下ejs的渲染标签
node既然是javascrip的,那么很多在前端执行代码的方式都可以放在后台从而达到无缝连接!
比如
var ygxx = function(){
document.getElementById("xm").innerHTML = '姓名:'+jyh.XM+'('+jyh.DS+')';
document.getElementById("sszd").innerHTML = '所属站点:'+jyh.SSZD;
document.getElementById("zw").innerHTML = '职务:'+jyh.ZW;
document.getElementById("lspgbh").innerHTML = '编号:'+bh.PGBH;
};
这个代码在以往,我的处理方式就是把HTML页面里生成一个 var jyh = {};的对象 载入页面之后自动渲染
有了node就不需要这样了,完全可以在后台做
当然这里主要配合express和ejs
网上收入的ejs标签介绍:
ejs 的标签系统非常简单,它只有以下3种标签。
1 |
<% code %>:JavaScript 代码。 |
2 |
<%= code %>:显示替换过 HTML 特殊字符的内容。 |
3 |
<%- code %>:显示原始 HTML 内容。 |
注意: <%= code %>
和 <%- code %>
的区别,当变量 code 为字符串时,两者没有区别;当 code 为比如<h1>hello</h1>
时,<%= code %>
会原样输出 <h1>hello</h1>
,而 <%- code %>
则会输出H1大的 hello。
EJS 的官方示例:
The Data
1 |
{ title: 'Cleaning Supplies' , |
2 |
supplies: [ 'mop' , 'broom' , 'duster' ] } |
The Template
1 |
<ul> |
2 |
<% for (var i= 0 ; i<supplies.length; i++) {%> |
3 |
<li><%= supplies[i] %></li> |
4 |
<% } %> |
5 |
</ul> |
The Result
- mop
- broom
- duster
我们可以用上述三种方式实现页面模板系统能实现的任何内容。
由此可以得出一个信息,ejs允许后台定义一个对象,然后前台模版用标签来实现调用对象
比如:
该文件为express的路由文件
exports.index = function(req, res){
res.render('index', {
code:{"GH":"1101","XM":"带头大哥","DS":"329","SSZD":"中国站","ZW":"管理员"}
});
};
后台定义一个对象,然后
前台模版
var ygxx = function(){
alert('AAA');
document.getElementById("xm").innerHTML = '姓名:<%= code.XM %>(<%= code.GH %>)';
document.getElementById("sszd").innerHTML = '所属站点:<%= code.SSZD %>';
document.getElementById("zw").innerHTML = '职务:<%= code.ZW %>';
};
如此这般就可以实现对象的调用,实际现实效果就是
姓名:带头大哥(1101)
所属站点:中国站
职务:管理员
另外还需要一个方式比如
前台有对象
var json = {}; 为了动态加入标签
var json = <%= code %>;
这里如果后台
exports.index = function(req, res){
res.render('index', {
code:'{"GH":"1101","XM":"带头大哥","DS":"329","SSZD":"中国站","ZW":"管理员"}'
});
};
后台渲染字符串,用<%= >标签会报乱码!!
应该用-号
var json = <%- code %>;
这样就可以了!
node.js开发笔记之EXPRESS与EJS之ejs标签v20140329的更多相关文章
- mac下配置Node.js开发环境、express安装、创建项目
mac下配置Node.js开发环境.express安装.创建项目 一.node.js的安装 去官网下载对应的平台版本就可以了,https://nodejs.org 二.express安装 sudo n ...
- Node.js学习笔记——Node.js开发Web后台服务
一.简介 Node.js 是一个基于Google Chrome V8 引擎的 JavaScript 运行环境.Node.js 使用了一个事件驱动.非阻塞式 I/O 的模型,使其轻量又高效.Node.j ...
- 《Node.js开发实战详解》学习笔记
<Node.js开发实战详解>学习笔记 ——持续更新中 一.NodeJS设计模式 1 . 单例模式 顾名思义,单例就是保证一个类只有一个实例,实现的方法是,先判断实例是否存在,如果存在则直 ...
- ES6 学习笔记 (2)-- Liunx环境安装Node.js 与 搭建 Node.js 开发环境
笔记参考来源:廖雪峰老师的javascript全栈教程 一.安装Node.js 目前Node.js的最新版本是6.2.x.首先,从Node.js官网下载对应平台的安装程序. 1.下载 选择对应的Liu ...
- Nodejs学习笔记(一)--- 简介及安装Node.js开发环境
目录 学习资料 简介 安装Node.js npm简介 开发工具 Sublime Node.js开发环境配置 扩展:安装多版本管理器 学习资料 1.深入浅出Node.js http://www.info ...
- Nodejs学习笔记(一)—简介及安装Node.js开发环境
一.简介 Node.js是让Javascript脱离浏览器运行在服务器的一个平台,不是语言: Node.js采用的Javascript引擎是来自Google Chrome的V8:运行在浏览器外不用考虑 ...
- 【转】Nodejs学习笔记(一)--- 简介及安装Node.js开发环境
目录 学习资料 简介 安装Node.js npm简介 开发工具 Sublime Node.js开发环境配置 扩展:安装多版本管理器 学习资料 1.深入浅出Node.js http://www.info ...
- 前端开发学习笔记 - 1. Node.JS安装笔记
Node.JS安装笔记 Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js uses an ...
- 系列文章--Node.js学习笔记系列
Node.js学习笔记系列总索引 Nodejs学习笔记(一)--- 简介及安装Node.js开发环境 Nodejs学习笔记(二)--- 事件模块 Nodejs学习笔记(三)--- 模块 Nodejs学 ...
随机推荐
- 正确使用pthread_create,防止内存泄漏
近日,听说pthread_create会造成内存泄漏,觉得不可思议,因此对posix(nptl)的线程创建和销毁进行了分析. 分析结果:如果使用不当,确实会造成内存泄漏. 产生根源:pthread ...
- Jquery前端分页插件pagination使用
插件描述:JqueryPagination是一个轻量级的jquery分页插件.只需几个简单的配置就可以生成分页控件.并且支持ajax获取数据,自定义请求参数,提供多种方法,事件和回调函数,功能全面的分 ...
- KMP练习——KMP模式匹配 一(串)
Description 求子串的next值,用next数组存放,所有输出 Input 输入一个字符串 Output 输出全部next值 Sample Input abaabcac Sample Out ...
- 【codeforces 779A】Pupils Redistribution
[题目链接]:http://codeforces.com/contest/779/problem/A [题意] 让你把两个组的5个人的数目都变成一样的. 支持交换操作; 问你最少需要交换几次. [题解 ...
- 谈谈android缓存文件
##内部存储 总是可用的 这里的文件默认是只能被你的app所访问的. 当用户卸载你的app的时候,系统会把internal里面的相关文件都清除干净. Internal是在你想确保不被用户与其他app所 ...
- 零碎笔记之ServiceManager
SM是开机的时候通过init.rc文件启动的,这就保证了它是系统中第一个注册成"服务大管家"的Service,所有的service服务都需要在SM中完成注册. ServiceMan ...
- URLDecoder和URLEncoder的使用总结
其实,这两个类的使用并不复杂,URLDecoder和URLEncoder它的作用主要是用于普通字符串和application/x-www-form-rulencoded MIME字符串之间的转换,一般 ...
- POJ - 1466 Girls and Boys 二分图+最大独立集
标题效果:有着n学生,有一些同学之间的特殊关系.. .为了一探究竟m学生.要求m免两者之间的学生有没有这样的特殊关系 解决问题的思路:二分图的问题,殊关系是对称的.所以能够将两个点集都设置为n个点.求 ...
- three.js 初学小示例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- MapReduce 编程 系列七 MapReduce程序日志查看
首先,假设须要打印日志,不须要用log4j这些东西,直接用System.out.println就可以,这些输出到stdout的日志信息能够在jobtracker网站终于找到. 其次,假设在main函数 ...