1.開發工具WebStorm 10.0.4
2.打開WebStorm 10.0.4新建項目：
ejs的特性：
1、緩存功能，能夠緩存已經解析好的html模版；
2、<% code %>用於執行其中javascript代碼；
3、<%= code %>會對code進行html轉義；
4、<%- code %>將不會進行轉義；
5、支持自定義標簽，比如'<%'可以使用'{{'，'%>'用'}}'代替；
6、提供一些輔助函數，用於模版中使用
7、利用<%- include filename %>加載其他頁面模版；
可以根據個人喜好選擇相應的模板
3.在app.js中：將圈起來的代碼注釋掉，寫上箭頭下的代碼
artTemplate不僅可以作為前端引擎，還可以作為后端引擎使用。
artTemplate是出色的javascript引擎，搭配出色的javascript運行時環境node.js一起使用，將會非常順暢。
4.在Terminal下
完成這個后你的node_modules文件夾下會相應多出一個 art-template 文件夾，
5.配置你的dbHelper
6.和4 一樣 npm install mssql
7.
8.users.js代碼
var express = require('express'); var router = express.Router(); var dbHelper = require('../modules/utils/dbHelper.js'); /* GET home page. */ //查詢所有用戶信息 router.get('/', function(req, res, next) { dbHelper.selectAll('dbo.users',function(err,result){ if(!err){ res.render('users',{datas:result}); } }); }); //執行刪除 router.get('/delete/:id',function(req, res, next){ var id=req.param("id"); dbHelper.del("where id = @id",{id:id},"dbo.users",function(err,recordset){ if(!err){ //res.render('users',{datas:recordset}); res.redirect('/users'); } else{ res.end(); } }); }); //根據id拿信息 router.get('/toupdate/:id',function(req, res, next){ var id=req.param("id"); dbHelper.select("dbo.users",1,"where id=@id",{id:id},"order by id",function(err,recordset){ if(!err){ res.render('update',{datas:recordset}); } else{ res.end(); } }); }); //執行修改 router.get('/update/:id/:name',function(req, res, next){ var id=req.param("id"); var name=req.param("name"); dbHelper.update({name:name},{id:id},"dbo.users",function(err,recordset){ if(!err){ res.redirect('/users'); } else{ res.end(); } }); }); //跳轉到添加用戶信息界面 router.get('/toaddurl',function(req,res,next){ res.render('add'); }); //執行添加 router.get('/add/:name',function(req, res, next){ var name=req.param("name"); dbHelper.add({name:name},"dbo.users",function(err,recordset){ if(!err){ res.redirect('/users'); } else{ res.end(); } }); }); module.exports = router;
9.users.html代碼
<!DOCTYPE html>
<html lang="en"> <head> <meta charset="UTF-8"> <title>用戶信息主頁面</title> </head> <body> <table> <tr> <th>編號</th> <th>姓名</th> <th>操作</th> <th><a href="/users/toaddurl">添加用戶</a></th> </tr> {{each datas as value }} <tr> <td>{{value.id}}</td> <td>{{value.name}}</td> <td><a href="/users/delete/{{value.id}}">刪除</a></td> <td><a href="/users/toupdate/{{value.id}}">修改</a></td> </tr> {{/each}} </table> </body> </html>
10.update.html代碼
<!DOCTYPE html>
<html lang="en"> <head> <meta charset="UTF-8"> <title>修改用戶信息頁面</title> <script type="text/javascript"> function update(){ var id = document.getElementById("id").value; var name = document.getElementById("name").value; window.location.href = "/users/update/" + id + "/" + name; } </script> </head> <body> <table> <form method="post"> {{each datas as val index}} <tr> <td><input type="hidden" value="{{val.id}}" id="id" /></td> </tr> <tr> <td>姓名:</td> <td><input type="text" id="name" value="{{val.name}}"></td> </tr> <tr> <td><input type="button" value="修改" onclick="javascript:update()"></td> </tr> {{/each}} </form> </table> </body> </html>
11.add.html代碼
<!DOCTYPE html>
<html lang="en"> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> function update(){ var name = document.getElementById("name").value; window.location.href = "/users/add/"+ name; } </script> </head> <body> 用戶名稱： <input type="text" id="name"> <input type="button" value="添加" onclick="javascript:update()"> </body> </html>
12.最終頁面