node.js中使用ejs渲染數(shù)據(jù)的代碼實(shí)現(xiàn)
更新時(shí)間：2023年11月11日 16:13:31 作者：萬(wàn)物得其道者成
這篇文章主要介紹了node.js中使用ejs渲染數(shù)據(jù),本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友參考下吧
用ejs模板引擎講面的數(shù)據(jù)渲染到頁(yè)面的表格中
[
{"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
第二步 ： 導(dǎo)入ejs模塊
第三步 ： 判斷路由 根據(jù)訪問不同的路由 渲染不同的ejs模板引擎
如何渲染ejs模板引擎?
ejs.renderFile( "路徑" , {數(shù)據(jù)} ,(err,data)=>{
} )
代碼實(shí)現(xiàn)：
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)建服務(wù)器
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,()=>{ //啟動(dòng)服務(wù)器
console.log("服務(wù)器已經(jīng)啟動(dòng)")
}) 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>商品價(jià)格</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>到此這篇關(guān)于node.js中使用ejs渲染數(shù)據(jù)的文章就介紹到這了,更多相關(guān)node.js ejs渲染數(shù)據(jù)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
本篇文章主要介紹了Mongoose全面理解，詳細(xì)的介紹了mongoose連接數(shù)據(jù)庫(kù)，查找讀取數(shù)據(jù)和數(shù)據(jù)驗(yàn)證等，有興趣的可以了解一下。2017-01-01
Node.js基礎(chǔ)入門之模塊與npm包管理器使用詳解
Node.js是一個(gè)基于Chrome?V8引擎的JavaScript運(yùn)行時(shí)。類似于Java中的JRE，.Net中的CLR。本文將詳細(xì)為大家介紹Node.js中的模塊與npm包管理器的使用，需要的可以參考一下2022-03-03
這篇文章主要介紹了簡(jiǎn)述pm2常用命令集合及配置文件說明,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
這篇文章主要給大家介紹了關(guān)于利用node.js如何爬取中關(guān)村的在線電瓶車信息的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用node.js具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-11-11
網(wǎng)上已經(jīng)有很多關(guān)于模擬登陸正方教務(wù)的作品了，基于 PHP，Python，Java，.Net 加上NodeJs，這幾門語(yǔ)言都可以實(shí)現(xiàn)模擬登陸，模擬登陸的技術(shù)點(diǎn)不是特別難，這里記錄一下利用Node碰到的一些坑，以及一些解決思路。2017-04-04
nodejs版本過高導(dǎo)致vue-cli項(xiàng)目無法正常運(yùn)行的幾種解決方案
這篇文章主要給大家介紹了關(guān)于nodejs版本過高導(dǎo)致vue-cli項(xiàng)目無法正常運(yùn)行的幾種解決方案,在項(xiàng)目中你可能需要用到的node版本太低,但是你所下的node版本是最新的,這時(shí)候就會(huì)報(bào)錯(cuò),需要的朋友可以參考下2023-07-07
Node.js是一個(gè)JavaScript運(yùn)行環(huán)境,可以使JavaScript這類腳本語(yǔ)言編寫出來的代碼運(yùn)行速度獲得極大提升,下面這篇文章主要給大家介紹了關(guān)于Node.js卸載與重裝及zip與msi安裝的相關(guān)資料,需要的朋友可以參考下2023-01-01
Nodejs實(shí)現(xiàn)短信驗(yàn)證碼功能
使用Nodejs的開發(fā)者愈來越多，基于Nodejs的后臺(tái)開發(fā)也多了起來，像短信驗(yàn)證碼、短信群發(fā)、國(guó)際短信這些需求，完全可以采用第三方接口來實(shí)現(xiàn)，云片就提供了這樣的接口2017-02-02
package-lock.json解決依賴的版本管理使用詳解
這篇文章主要為大家介紹了package-lock.json解決依賴的版本管理使用詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
Node.js如何自動(dòng)審核團(tuán)隊(duì)的代碼
在項(xiàng)目開發(fā)中，統(tǒng)一團(tuán)隊(duì)的代碼風(fēng)格很重要，本文介紹如何用Node.js來自動(dòng)審核，來提高您的開發(fā)速度。2016-07-07