node.js中使用ejs渲染數據的代碼實現

更新時間：2023年11月11日 16:13:31 作者：萬物得其道者成

這篇文章主要介紹了node.js中使用ejs渲染數據,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友參考下吧

用ejs模板引擎講面的數據渲染到頁面的表格中

 [
    {"pid":1,"pname":"小米1","price":2888},
    {"pid":2,"pname":"小米2","price":3888},
    {"pid":3,"pname":"小米3","price":4888},
    {"pid":4,"pname":"小米4","price":5888},
    {"pid":5,"pname":"小米5","price":6888},
]

ejs模板引擎的使用

第一步： ejs的安裝 npm i ejs

第二步：導入ejs模塊

第三步：判斷路由根據訪問不同的路由渲染不同的ejs模板引擎

如何渲染ejs模板引擎?

ejs.renderFile( "路徑" , {數據} ,(err,data)=>{

} )

代碼實現：

js部分：

    const http = require("http")
const url = require("url")
const ejs = require("ejs")
let arr = [
	{"pid":1,"pname":"小米1","price":2888},
	{"pid":2,"pname":"小米2","price":3888},
	{"pid":3,"pname":"小米3","price":4888},
	{"pid":4,"pname":"小米4","price":5888},
	{"pid":5,"pname":"小米5","price":6888},
]
//創(chuàng)建服務器
http.createServer((req,res)=>{
    //查找路由
    let pathname = url.parse(req.url).pathname
    if(pathname == "/home"){
        //渲染ejs模板引擎
        ejs.renderFile("./index.ejs",{arra:arr},(err,data)=>{
            res.end(data)
        })
    }
}).listen(3002,()=>{ //啟動服務器
    console.log("服務器已經啟動")
})

html部分：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <table border="1" cellapdding="20" cellspacing="0">
        <thead>
            <tr>
                <td>#</td>
                <td>商品名稱</td>
                <td>商品價格</td>
            </tr>
        </thead>
        <tbody>
            <% arra.forEach(item=>{%>
                <tr>
                    <td><%= item.pid%></td>
                    <td><%= item.pname%></td>
                    <td><%= item.price%></td>
                </tr>  
            <%})%>
        </tbody>
    </table>
</body>
</html>

到此這篇關于node.js中使用ejs渲染數據的文章就介紹到這了,更多相關node.js ejs渲染數據內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

Mongoose學習全面理解(推薦)
本篇文章主要介紹了Mongoose全面理解，詳細的介紹了mongoose連接數據庫，查找讀取數據和數據驗證等，有興趣的可以了解一下。
2017-01-01
Node.js基礎入門之模塊與npm包管理器使用詳解
Node.js是一個基于Chrome?V8引擎的JavaScript運行時。類似于Java中的JRE，.Net中的CLR。本文將詳細為大家介紹Node.js中的模塊與npm包管理器的使用，需要的可以參考一下
2022-03-03
簡述pm2常用命令集合及配置文件說明
這篇文章主要介紹了簡述pm2常用命令集合及配置文件說明,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2019-05-05
node.js爬取中關村的在線電瓶車信息
這篇文章主要給大家介紹了關于利用node.js如何爬取中關村的在線電瓶車信息的相關資料，文中通過示例代碼介紹的非常詳細，對大家學習或者使用node.js具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2018-11-11
NodeJs模擬登陸正方教務
網上已經有很多關于模擬登陸正方教務的作品了，基于 PHP，Python，Java，.Net 加上NodeJs，這幾門語言都可以實現模擬登陸，模擬登陸的技術點不是特別難，這里記錄一下利用Node碰到的一些坑，以及一些解決思路。
2017-04-04
nodejs版本過高導致vue-cli項目無法正常運行的幾種解決方案
這篇文章主要給大家介紹了關于nodejs版本過高導致vue-cli項目無法正常運行的幾種解決方案,在項目中你可能需要用到的node版本太低,但是你所下的node版本是最新的,這時候就會報錯,需要的朋友可以參考下
2023-07-07
Node.js卸載與重裝及zip與msi安裝詳解
Node.js是一個JavaScript運行環(huán)境,可以使JavaScript這類腳本語言編寫出來的代碼運行速度獲得極大提升,下面這篇文章主要給大家介紹了關于Node.js卸載與重裝及zip與msi安裝的相關資料,需要的朋友可以參考下
2023-01-01
Nodejs實現短信驗證碼功能
使用Nodejs的開發(fā)者愈來越多，基于Nodejs的后臺開發(fā)也多了起來，像短信驗證碼、短信群發(fā)、國際短信這些需求，完全可以采用第三方接口來實現，云片就提供了這樣的接口
2017-02-02
package-lock.json解決依賴的版本管理使用詳解
這篇文章主要為大家介紹了package-lock.json解決依賴的版本管理使用詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
2023-08-08
Node.js如何自動審核團隊的代碼
在項目開發(fā)中，統(tǒng)一團隊的代碼風格很重要，本文介紹如何用Node.js來自動審核，來提高您的開發(fā)速度。
2016-07-07