• nodejs 返回html页面--使用 ejs 模板


    nodejs 返回html页面--使用 ejs 模板

     

    nodejs 可以直接在返回中使用html标签,例如下面的格式,返回 hello world 将会使用 h1 字体。

    app.get('/html',function(req,res){
      res.status(200).send('<h1>hello world</h1>');
    });

    "E" is for "effective." EJS is a simple templating language that lets you generate HTML markup with plain JavaScript. 

    安装ejs: npm install ejs 

    例子一:

    test_163:/home/exenode/jike # more ejslearn.js 
    var express = require('express');

    var app = express();

    app.set('view engine','ejs');
    app.set('views', __dirname + '/views');       //设置模板文件文件夹,__dirname为全局变量,表示网站根目录。把view目录下的文件设置成模板文件。

    app.get('/',function(req,res){
      res.render('home.ejs',{name:'zzz'});    //向页面模板传递参数,可以传递字符串和对象。 并且把页面模板返回给客户端。以json的格式传给 模板页面。

    });

    app.listen(3002);
    test_163:/home/exenode/jike # more views/home.ejs 
    <html>
      <head>
        <title> new template </title>
      </head>
      <body>
        <p>Hello jikexueyuan</p>
        <p>Hi <%= name %></p>
      </body>
    </html>

    输出的html页面显示:

    Hello jikexueyuan

    Hi zzz

    例子二:

    test_163:/home/exenode/jike # more ejslearn.js 
    var express = require('express');
    var app = express();

    app.set('view engine','ejs');
    app.set('views', __dirname + '/views');

    app.get('/',function(req,res){
      res.render('home.ejs',{name:'zzz'});
    });

    app.get('/request/:name',function(req,res){                                         //设置请求url中 request 后的字符串,保存到 name 这个变量中。
      // var locals = {name:'westbrook','name':req.params['name']};       
      var locals = {name:req.params['name']}                                       // 把 req.params['name'] 的值作为 字典locals 的 key name 的值。 
      res.render('home.ejs',locals);
    });

    app.listen(3002);
    test_163:/home/exenode/jike # 
    test_163:/home/exenode/jike # more views/home.ejs 
    <html>
      <head>
        <title> new template </title>
      </head>
      <body>
        <p>Hello jikexueyuan</p>
        <p>Hi <%= name %></p>                             //获取name的值。
        <p>name:<%= name %></p>                        //获取name的值。

       </body>
    </html>

    结果:

    在前台浏览器中访问: http://192.168.1.163:3002/request/test123  ,页面显示:

    Hello jikexueyuan

    Hi test123

    my name is:test123

     
    分类: 前端
  • 相关阅读:
    Jedis 源代码阅读一 —— Jedis
    Java中的${pageContext.request.contextPath}
    VMware Workstation 12 安装mac os x 10.11
    机器学习——朴素贝叶斯分类器
    Codeforces 138C(区间更新+离散化)
    Threejs 官网
    深刻理解Nginx之Nginx完整安装
    Apache + Tomcat 负载均衡 session复制
    小P寻宝记——好基友一起走
    C++数值类型极限值的获取
  • 原文地址:https://www.cnblogs.com/developer-ios/p/5999892.html
Copyright © 2020-2023  润新知