Node.js 极简笔记
Node.js
一.Node基礎
概念:Javascript運行時平臺,不是語言,也不是框架,是一個平臺。
1.1 what is node ?
- Node.js 是一個基于Chrome V8 引擎的JavaScript運行環境
- Node.js使用了一個事件驅動、非阻塞式I/O的模型,使其輕量又高效
- Node.js的包管理工具npm,是全球最大的開源庫生態系統
- 官網 http://nodejs.cn/
- npm 插件官網:https://www.npmjs.com/
1.2作用
1.3為什么學習?
1.4 常見問題
- Python環境丟失
- Node中有些第三方的包是以C/C++源碼的方式發布的,需要安裝后編譯,確保全局環境中可以使用python命令,python 版本推薦2.7.0
- 環境變量丟失
- 部分電腦安裝完畢之后沒有環境變量需要手動配置
- Windows中環境變量分為系統變量和用戶變量
- 環境變量的變量名是不區分大小寫的
- PATH 變量:只要添加到 PATH 變量中的路徑,都可以在任何目錄下
- 目的可以在任何地方調起node命令
1.4 案例:操作步驟
Hello.js
1.編寫js文件
2.定位到目錄
3.輸入node xxx.js,解釋執行
let str="hello world"console.log(str) console.log(window) //沒有bom console.log(document) //沒有dom多出來的功能:
//1.定義導入包 let fs=require('fs') //2.讀取hello.js //參數:路徑,匿名函數 fs.readFile('hello.js',function (error,data) {console.log(data);//utf-8編碼console.log(data.toString()); //格式可以輸出 })輸出的格式不是ASCI編碼格式,注意!!!
關于參數的代碼理解
//1.定義導入包 let fs=require('fs') //2.讀取hello.js //參數:路徑,匿名函數 fs.readFile('hello2.js',function (error,data) {// if(error==null)// console.log('沒有錯誤')if(error)console.log('讀取文件失敗!')elseconsole.log(data.toString()); })1.5 http服務
//1.導入http包 let http=require('http') //2.定義server變量,返回一個server實例; let server=http.createServer() //3.服務器的響應,接受request請求,產生會回調事件 server.on('request',function () {console.log('接受來自客戶端的請求....') }) //4.綁定到響應的端口號; server.listen(3000,function () {console.log('服務器啟動了,可以通過http://localhost:3000/來訪問...') }) //1.導入http包 let http=require('http') //2.定義server變量,返回一個server實例; let server=http.createServer() //3.服務器的響應,接受request請求,產生會回調事件 //增加參數:request、response server.on('request',function (request,response) {console.log('接受來自客戶端的請求....')console.log('請求路徑是:'+request.url)//response:響應輸出;服務器發送給客戶端response.write('你好')response.write('test...aaa')response.end() }) //4.綁定到響應的端口號; server.listen(3000,function () {console.log('服務器啟動了,可以通過http://localhost:3000/來訪問...') })根據不同的url返回不同的服務
let url=request.url
url返回的是/之后的路徑
//1.導入http包 let http=require('http') //2.定義server變量,返回一個server實例; let server=http.createServer() //3.服務器的響應,接受request請求,產生會回調事件 //增加參數:request、response server.on('request',function (request,response) {console.log('接受來自客戶端的請求....')console.log('請求路徑是:'+request.url)//3.1獲取請求的url路徑信息;let url=request.urlconsole.log('----'+url)//接下來,根據url進行判斷;if(url=='/'){response.end('index.html')}else if(url=='/login'){response.end('login.html')}else if(url=='/products'){let products=[{name:'蘋果',price:4.5},{name:'香蕉',price:3.5},{name:'橘子',price:2.5}]response.end(JSON.stringify(products))}else{response.end('404 Error')}//response:響應輸出;服務器發送給客戶端// response.write('你好')// response.write('test...aaa')// response.end() }) //4.綁定到響應的端口號; server.listen(3000,function () {console.log('服務器啟動了,可以通過http://localhost:3000/來訪問...') })二.模塊
模塊分為三種:
2.1 內置模塊
之前代碼require(‘fs’)就是引用的內置模塊。Node為JS提供了很多服務器級別的API,這些API絕大多數都被包裝到了一個有名字的核心模塊。例如文件操作的fs模塊。
使用格式:
let 變量名=require(‘模塊名’) //fs:文件讀寫模塊
let http=require(‘http’) //http:協議模塊;
let path=require(‘path’) //路徑處理模塊
let os=require(‘os’)
let fs=require(‘fs’)
2.1.1.文件夾的操作
let fs = require("fs"); //創建文件夾 //fs.mkdir('./hello',(err,data)=>{ // console.log(err); // console.log(data); //});//修改文件夾 //fs.rename('./hello','./testyyh',(err)=>{ // if(err){ // console.log("error"); // }else{ // console.log("ok"); // } //}); //刪除文件夾-->只能刪除空文件夾 fs.rmdir('./testyyh',(err)=>{if(err){console.log('刪除失敗');console.log(err);}else{console.log('ok');}2.1.2 文件的操作
const fs = require('fs'); //創建文件,覆蓋寫入,正常的話則是追加 //fs.writeFile('test.txt','這是我的第一個文件',(err)=>{ // if(err){ // console.log('創建失敗'); // console.log(err); // }else{ // // console.log('創建成功!'); // } // //}); //讀取文件,在原來的基礎上追加文件 //fs.appendFile('test.txt','韓梅梅你好',(err)=>{ // console.log(err); //});//讀取文件這是第一種方式 //fs.readFile('test.txt',(err,msg)=>{ // console.log(err); // console.log(msg.toString("utf8"));//在轉化為字符串的時候指定編碼方式 //}); //在參數中指定編碼方式 //fs.readFile('test.txt','utf8',(err,msg)=>{ // // console.log(err); // console.log(msg); //}); //刪除文件 //fs.unlink('./test.txt',(err)=>{ // console.log(err); //});2.1.3 判斷是文件還是目錄
const fs = require('fs'); fs.readdir('./',(err,dirs)=>{for(let index=0;index<dirs.length;index++){console.log(dirs[index]);} }); fs.stat('./',(err,stats)=>{if(stats.isFile()){console.log('是一個文件');}else{console.log('是一個目錄');} });2.2 自定義模塊
詳細介紹自定義模塊:
創建一個模塊(一個js文件就是一個模塊),這是test.js
let hellomodule={sayhell(){console.log("hello world");} } module.exports=hellomodule在另外一個文件進行調用
//1.導入文件;必須是./的模式,直接路徑不可用; let testModule=require('./module.js') //2.直接使用; console.log(testModule) testModule.sayhell()2.3 操作系統
//1.引用os核心模塊 let os=require('os')//2.輸出cpu的信息; console.log(os.cpus()) //內存信息 console.log(os.totalmem()) console.log(os.type) //.1.1引用path核心模塊 let path=require('path')//2.測試path; path.extname('c:/soft/oop.java') //ext:擴展名 console.log(path.extname('c:/soft/oop.java')) //輸出端口號; console.log('請求端口號:'+request.socket.remotePort) console.log('請求地址:'+request.socket.remoteAddress)2.4 http+箭頭函數
let http=require('http')let server=http.createServer()server.on('request',(req,resp)=>{console.log('請求地址:'+req.url)console.log('請求客戶端地址信息:'+req.socket.remotePort,req.socket.remoteAddress)resp.end('hello world.張晨光...') })server.listen(5000,()=>{console.log('服務器啟動可以訪問了...') })可以啟動多個服務,端口號不同就行!!!
2.5 發送文件內容
let http=require('http') let fs=require('fs')let server=http.createServer()server.on('request',(req,resp)=>{let url=req.urlif(url==='/'){fs.readFile('./hello.html',(err,data)=>{if(err){resp.setHeader('Content-Type','text/plain;charset=utf-8')resp.end('文件讀取失敗!')}else{resp.setHeader('Content-Type','text/html;charset=utf-8')resp.end(data)}})} })server.listen(3000,()=>{console.log('服務器啟動可以訪問了...') })可以讀取圖片的程序升級
let http=require('http') let fs=require('fs')let server=http.createServer()server.on('request',(req,resp)=>{let url=req.urlif(url==='/'){fs.readFile('./hello.html',(err,data)=>{if(err){resp.setHeader('Content-Type','text/plain;charset=utf-8')resp.end('文件讀取失敗!')}else{resp.setHeader('Content-Type','text/html;charset=utf-8')resp.end(data)}})}else if(url==='/photo'){fs.readFile('./resources/2a.jpg',(err,data)=>{if(err){resp.setHeader('Content-Type','text/plain;charset=utf-8')resp.end('圖片讀取失敗!')}else{resp.setHeader('Content-Type','image/jpeg')resp.end(data)}})} })server.listen(3000,()=>{console.log('服務器啟動可以訪問了...') })Http Mime Type
| .*( 二進制流,不知道下載文件類型) | application/octet-stream | .tif | image/tiff |
| .001 | application/x-001 | .301 | application/x-301 |
| .323 | text/h323 | .906 | application/x-906 |
| .907 | drawing/907 | .a11 | application/x-a11 |
| .acp | audio/x-mei-aac | .ai | application/postscript |
| .aif | audio/aiff | .aifc | audio/aiff |
| .aiff | audio/aiff | .anv | application/x-anv |
| .asa | text/asa | .asf | video/x-ms-asf |
| .asp | text/asp | .asx | video/x-ms-asf |
| .au | audio/basic | .avi | video/avi |
| .awf | application/vnd.adobe.workflow | .biz | text/xml |
| .bmp | application/x-bmp | .bot | application/x-bot |
| .c4t | application/x-c4t | .c90 | application/x-c90 |
| .cal | application/x-cals | .cat | application/vnd.ms-pki.seccat |
| .cdf | application/x-netcdf | .cdr | application/x-cdr |
| .cel | application/x-cel | .cer | application/x-x509-ca-cert |
| .cg4 | application/x-g4 | .cgm | application/x-cgm |
| .cit | application/x-cit | .class | java/* |
| .cml | text/xml | .cmp | application/x-cmp |
| .cmx | application/x-cmx | .cot | application/x-cot |
| .crl | application/pkix-crl | .crt | application/x-x509-ca-cert |
| .csi | application/x-csi | .css | text/css |
| .cut | application/x-cut | .dbf | application/x-dbf |
| .dbm | application/x-dbm | .dbx | application/x-dbx |
| .dcd | text/xml | .dcx | application/x-dcx |
| .der | application/x-x509-ca-cert | .dgn | application/x-dgn |
| .dib | application/x-dib | .dll | application/x-msdownload |
| .doc | application/msword | .dot | application/msword |
| .drw | application/x-drw | .dtd | text/xml |
| .dwf | Model/vnd.dwf | .dwf | application/x-dwf |
| .dwg | application/x-dwg | .dxb | application/x-dxb |
| .dxf | application/x-dxf | .edn | application/vnd.adobe.edn |
| .emf | application/x-emf | .eml | message/rfc822 |
| .ent | text/xml | .epi | application/x-epi |
| .eps | application/x-ps | .eps | application/postscript |
| .etd | application/x-ebx | .exe | application/x-msdownload |
| .fax | image/fax | .fdf | application/vnd.fdf |
| .fif | application/fractals | .fo | text/xml |
| .frm | application/x-frm | .g4 | application/x-g4 |
| .gbr | application/x-gbr | . | application/x- |
| .gif | image/gif | .gl2 | application/x-gl2 |
| .gp4 | application/x-gp4 | .hgl | application/x-hgl |
| .hmr | application/x-hmr | .hpg | application/x-hpgl |
| .hpl | application/x-hpl | .hqx | application/mac-binhex40 |
| .hrf | application/x-hrf | .hta | application/hta |
| .htc | text/x-component | .htm | text/html |
| .html | text/html | .htt | text/webviewhtml |
| .htx | text/html | .icb | application/x-icb |
| .ico | image/x-icon | .ico | application/x-ico |
| .iff | application/x-iff | .ig4 | application/x-g4 |
| .igs | application/x-igs | .iii | application/x-iphone |
| .img | application/x-img | .ins | application/x-internet-signup |
| .isp | application/x-internet-signup | .IVF | video/x-ivf |
| .java | java/* | .jfif | image/jpeg |
| .jpe | image/jpeg | .jpe | application/x-jpe |
| .jpeg | image/jpeg | .jpg | image/jpeg |
| .jpg | application/x-jpg | .js | application/x-javascript |
| .jsp | text/html | .la1 | audio/x-liquid-file |
| .lar | application/x-laplayer-reg | .latex | application/x-latex |
| .lavs | audio/x-liquid-secure | .lbm | application/x-lbm |
| .lmsff | audio/x-la-lms | .ls | application/x-javascript |
| .ltr | application/x-ltr | .m1v | video/x-mpeg |
| .m2v | video/x-mpeg | .m3u | audio/mpegurl |
| .m4e | video/mpeg4 | .mac | application/x-mac |
| .man | application/x-troff-man | .math | text/xml |
| .mdb | application/msaccess | .mdb | application/x-mdb |
| .mfp | application/x-shockwave-flash | .mht | message/rfc822 |
| .mhtml | message/rfc822 | .mi | application/x-mi |
| .mid | audio/mid | .midi | audio/mid |
| .mil | application/x-mil | .mml | text/xml |
| .mnd | audio/x-musicnet-download | .mns | audio/x-musicnet-stream |
| .mocha | application/x-javascript | .movie | video/x-sgi-movie |
| .mp1 | audio/mp1 | .mp2 | audio/mp2 |
| .mp2v | video/mpeg | .mp3 | audio/mp3 |
| .mp4 | video/mpeg4 | .mpa | video/x-mpg |
| .mpd | application/vnd.ms-project | .mpe | video/x-mpeg |
| .mpeg | video/mpg | .mpg | video/mpg |
| .mpga | audio/rn-mpeg | .mpp | application/vnd.ms-project |
| .mps | video/x-mpeg | .mpt | application/vnd.ms-project |
| .mpv | video/mpg | .mpv2 | video/mpeg |
| .mpw | application/vnd.ms-project | .mpx | application/vnd.ms-project |
| .mtx | text/xml | .mxp | application/x-mmxp |
| .net | image/pnetvue | .nrf | application/x-nrf |
| .nws | message/rfc822 | .odc | text/x-ms-odc |
| .out | application/x-out | .p10 | application/pkcs10 |
| .p12 | application/x-pkcs12 | .p7b | application/x-pkcs7-certificates |
| .p7c | application/pkcs7-mime | .p7m | application/pkcs7-mime |
| .p7r | application/x-pkcs7-certreqresp | .p7s | application/pkcs7-signature |
| .pc5 | application/x-pc5 | .pci | application/x-pci |
| .pcl | application/x-pcl | .pcx | application/x-pcx |
| application/pdf | application/pdf | ||
| .pdx | application/vnd.adobe.pdx | .pfx | application/x-pkcs12 |
| .pgl | application/x-pgl | .pic | application/x-pic |
| .pko | application/vnd.ms-pki.pko | .pl | application/x-perl |
| .plg | text/html | .pls | audio/scpls |
| .plt | application/x-plt | .png | image/png |
| .png | application/x-png | .pot | application/vnd.ms-powerpoint |
| .ppa | application/vnd.ms-powerpoint | .ppm | application/x-ppm |
| .pps | application/vnd.ms-powerpoint | .ppt | application/vnd.ms-powerpoint |
| .ppt | application/x-ppt | .pr | application/x-pr |
| .prf | application/pics-rules | .prn | application/x-prn |
| .prt | application/x-prt | .ps | application/x-ps |
| .ps | application/postscript | .ptn | application/x-ptn |
| .pwz | application/vnd.ms-powerpoint | .r3t | text/vnd.rn-realtext3d |
| .ra | audio/vnd.rn-realaudio | .ram | audio/x-pn-realaudio |
| .ras | application/x-ras | .rat | application/rat-file |
| .rdf | text/xml | .rec | application/vnd.rn-recording |
| .red | application/x-red | .rgb | application/x-rgb |
| .rjs | application/vnd.rn-realsystem-rjs | .rjt | application/vnd.rn-realsystem-rjt |
| .rlc | application/x-rlc | .rle | application/x-rle |
| .rm | application/vnd.rn-realmedia | .rmf | application/vnd.adobe.rmf |
| .rmi | audio/mid | .rmj | application/vnd.rn-realsystem-rmj |
| .rmm | audio/x-pn-realaudio | .rmp | application/vnd.rn-rn_music_package |
| .rms | application/vnd.rn-realmedia-secure | .rmvb | application/vnd.rn-realmedia-vbr |
| .rmx | application/vnd.rn-realsystem-rmx | .rnx | application/vnd.rn-realplayer |
| .rp | image/vnd.rn-realpix | .rpm | audio/x-pn-realaudio-plugin |
| .rsml | application/vnd.rn-rsml | .rt | text/vnd.rn-realtext |
| .rtf | application/msword | .rtf | application/x-rtf |
| .rv | video/vnd.rn-realvideo | .sam | application/x-sam |
| .sat | application/x-sat | .sdp | application/sdp |
| .sdw | application/x-sdw | .sit | application/x-stuffit |
| .slb | application/x-slb | .sld | application/x-sld |
| .slk | drawing/x-slk | .smi | application/smil |
| .smil | application/smil | .smk | application/x-smk |
| .snd | audio/basic | .sol | text/plain |
| .sor | text/plain | .spc | application/x-pkcs7-certificates |
| .spl | application/futuresplash | .spp | text/xml |
| .ssm | application/streamingmedia | .sst | application/vnd.ms-pki.certstore |
| .stl | application/vnd.ms-pki.stl | .stm | text/html |
| .sty | application/x-sty | .svg | text/xml |
| .swf | application/x-shockwave-flash | .tdf | application/x-tdf |
| .tg4 | application/x-tg4 | .tga | application/x-tga |
| .tif | image/tiff | .tif | application/x-tif |
| .tiff | image/tiff | .tld | text/xml |
| .top | drawing/x-top | .torrent | application/x-bittorrent |
| .tsd | text/xml | .txt | text/plain |
| .uin | application/x-icq | .uls | text/iuls |
| .vcf | text/x-vcard | .vda | application/x-vda |
| .vdx | application/vnd.visio | .vml | text/xml |
| .vpg | application/x-vpeg005 | .vsd | application/vnd.visio |
| .vsd | application/x-vsd | .vss | application/vnd.visio |
| .vst | application/vnd.visio | .vst | application/x-vst |
| .vsw | application/vnd.visio | .vsx | application/vnd.visio |
| .vtx | application/vnd.visio | .vxml | text/xml |
| .wav | audio/wav | .wax | audio/x-ms-wax |
| .wb1 | application/x-wb1 | .wb2 | application/x-wb2 |
| .wb3 | application/x-wb3 | .wbmp | image/vnd.wap.wbmp |
| .wiz | application/msword | .wk3 | application/x-wk3 |
| .wk4 | application/x-wk4 | .wkq | application/x-wkq |
| .wks | application/x-wks | .wm | video/x-ms-wm |
| .wma | audio/x-ms-wma | .wmd | application/x-ms-wmd |
| .wmf | application/x-wmf | .wml | text/vnd.wap.wml |
| .wmv | video/x-ms-wmv | .wmx | video/x-ms-wmx |
| .wmz | application/x-ms-wmz | .wp6 | application/x-wp6 |
| .wpd | application/x-wpd | .wpg | application/x-wpg |
| .wpl | application/vnd.ms-wpl | .wq1 | application/x-wq1 |
| .wr1 | application/x-wr1 | .wri | application/x-wri |
| .wrk | application/x-wrk | .ws | application/x-ws |
| .ws2 | application/x-ws | .wsc | text/scriptlet |
| .wsdl | text/xml | .wvx | video/x-ms-wvx |
| .xdp | application/vnd.adobe.xdp | .xdr | text/xml |
| .xfd | application/vnd.adobe.xfd | .xfdf | application/vnd.adobe.xfdf |
| .xhtml | text/html | .xls | application/vnd.ms-excel |
| .xls | application/x-xls | .xlw | application/x-xlw |
| .xml | text/xml | .xpl | audio/scpls |
| .xq | text/xml | .xql | text/xml |
| .xquery | text/xml | .xsd | text/xml |
| .xsl | text/xml | .xslt | text/xml |
| .xwd | application/x-xwd | .x_b | application/x-x_b |
| .sis | application/vnd.symbian.install | .sisx | application/vnd.symbian.install |
| .x_t | application/x-x_t | .ipa | application/vnd.iphone |
| .apk | application/vnd.android.package-archive | .xap | application/x-silverlight-app |
2.3 第三方模塊
art-template
vue
必須通過npm 安裝
2.4 模塊化概念
-
文件作用域
-
通信規則
- 加載 require
- 導出
2.5 CommonJs模塊規范
-
模塊作用域
-
使用require來加載模塊
語法:var|let 變量名=require(‘模塊’)
作用:執行被加載模塊中的代碼;得到被加載模塊中的exports導出接口對象
-
使用exports接口對象來導出模塊中的成員
node是模塊作用域,所有成員再當前模塊有效;
module.exports=‘字符串’
module.exports=function(){}
后面會覆蓋前面的值;
注意:exports是module.exports的一個引用,不能直接賦值。
2.6 require 加載規則
- 優先從緩存加載
- 判斷模塊標識
- 核心模塊
- 第三方模塊
- 自定義模塊
測試第三方模塊,在node_modules下新建一個a目錄,創建package.json的文件
{"main":"foo.js" }foo.js
console.log('a中的foo.js被加載了...')module.exports=()=>{console.log('fooooooo....') } //如果package.json不存在或者main指定的入口模塊也沒有,則node會自動查找該目錄下的index.js //即index.js會作為一個默認備選項。如果上述條件不成立,則去上級目錄去尋找node_modules的目錄,沒有繼續往 //上級尋找,在a目錄下創建index.js console.log('a--->index')如果繼續往上一級查找node_modules,還沒有找到,則顯示:
Error: Cannot find module ‘vue’
注意:我們的一個項目有且只有一個node_modules,這樣項目都可以加載到第三方模塊包,不會出現多個。
三.模板引擎
3.1 Apache功能
apache軟件默認有一個www目錄,此目錄下的html文件都可以通過node。案例模擬實現apache項目在瀏覽器的效果。
讀取node下的www目錄文件的代碼
let http=require('http') let fs=require('fs')//2.開始設置服務; let server=http.createServer() server.on('request',(req,resp)=>{let url=req.url//如果是這個方式的話,去某個地方/** / index.html* /a.txt +/a.txt* /mi/login.html* /img/bg.jpg wwwdir+/img/bg.jpg* */let wwwDir='D:/aaa/node/www'let filePath='/index.html'if(url!=='/'){filePath=url}console.log(wwwDir+filePath)fs.readFile(wwwDir+filePath,(err,data)=>{if(err){console.log('404 Not Found!')}resp.end(data)})}) //3.綁定機制; server.listen(3000,()=>{console.log('啟動了...') })3.2 art-template
模板引擎不關心內容,只關心自己能認識的模板標記語法。Mustache是一個logic-less(輕邏輯)模板解析引擎,
它是為了使用戶界面與業務數據(內容)分離而產生的,
它可以生成特定格式的文檔,通常是標準的HTML文檔。
比如小程序的wxml中的代碼
{{userInfo.nickName}},這里的{{ }}就是Mustache的語法。1 介紹:
art-template 是一個簡約、超快的模板引擎。
它采用作用域預聲明的技術來優化模板渲染速度,從而獲得接近 JavaScript 極限的運行性能,并且同時支持 NodeJS 和瀏覽器。
1.1 模板語法:
art-template 同時支持兩種模板語法。標準語法可以讓模板更容易讀寫;原始語法具有強大的邏輯處理能力。
{{if user}} <h2>{{user.name}}</h2> {{/if}} <% if (user) { %> <h2><%= user.name %></h2> <% } %>使用步驟:
1.安裝
? npm install art-template
2.在需要使用的文件中加載art-template
let temp=require(‘art-template’)
3.查文檔,使用art-template的API
在node-modules下的模板文件
<!DOCTYPE html> <html style="height: 100%"> <head><meta charset="utf-8"><!--<title>{{ title }}</title>--><title><%=title%></title> </head> <body><script src="../node_modules/art-template/lib/template-web.js"></script><script type="text/template" id="tp1">hello{{name}}年齡:{{age}}地址:{{address}}愛好:{{each hobbies}}{{$value}}{{/each}}</script><!--測試--><script>var ret=template('tp1',{name:'jack ma',age:22,address:'河南省鄭州市',hobbies:['吃好飯','唱好歌','開好車']})console.log(ret)</script> </body> </html>node.js使用art-template
let template=require('art-template')//template('script標簽id',{對象}) let result=template.render('Hello:{{name}}',{name:'張晨光'})console.log(result)結合模板來使用
let template=require('art-template')let tempstr=`<!DOCTYPE html> <html style="height: 100%"> <head><meta charset="utf-8"><title><%=title%></title> </head> <body>hello{{name}}年齡:{{age}}地址:{{address}}愛好:{{each hobbies}}{{$value}}{{/each}} </body> </html>`//template('script標簽id',{對象}) let result=template.render(tempstr,{name:'jack ma',age:22,address:'河南省鄭州市',hobbies:['吃好飯','唱好歌','開好車'] })console.log(result)不能使用這種方式,需要使用文件來讀寫
模板頁面:
<!DOCTYPE html> <html style="height: 100%"> <head><meta charset="utf-8"><title><%=title%></title> </head> <body> hello{{name}}年齡:{{age}}地址:{{address}}愛好:{{each hobbies}}{{$value}}{{/each}} </body> </html> <!--測試--><script>var ret=template('tp1',{name:'jack ma',age:22,address:'河南省鄭州市',hobbies:['吃好飯','唱好歌','開好車']})console.log(ret)</script>node.js代碼;
let template=require('art-template')let fs=require('fs') fs.readFile('./template.html',(err,data)=>{if(err){return console.log('讀取文件有誤...')}//沒有問題,則這樣;//template('script標簽id',{對象})let result=template.render(data.toString(),{name:'jack ma',age:22,address:'河南省鄭州市',hobbies:['吃好飯','唱好歌','開好車']})console.log(result)}) 創作挑戰賽新人創作獎勵來咯,堅持創作打卡瓜分現金大獎總結
以上是生活随笔為你收集整理的Node.js 极简笔记的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: JAVAEE框架之SpringMVC基础
- 下一篇: Ajax后端极简笔记