node.js+express制作網(wǎng)頁計算器

更新時間：2016年01月17日 14:29:01 投稿：hebedich

這篇文章主要介紹了node.js+express制作網(wǎng)頁計算器的相關資料,需要的朋友可以參考下

環(huán)境：

主機:WIN10

express安裝：

1.安裝express-generator

輸入命令：

npm install -g express-generator

2.安裝express

輸入命令：

npm install -g express

3.驗證是否安裝成功

輸入命令：express -V

查看幫助：express --help

建立工程：

express -e calculator

cd calculator && npm install

運行默認網(wǎng)頁：

輸入命令：npm start或者node ./bin/www

端口配置在/bin/www中。

可以執(zhí)行加法運算。

源代碼：

view/index.ejs:增加輸入框

<!DOCTYPE html> 
<html> 
 <head> 
  <title><%= title %></title> 
  <link rel='stylesheet' href='/stylesheets/style.css' /> 
 </head> 
 <body> 
    <form method="post"> 
      <p>計算器</p> 
    <input type="text" name="num1" value=<%= numa %> /><br /> 
    <input type="text" name="num2" value=<%= numb %> /><br /> 
    <input type="submit" value="計算" /> 
    <p>結果:<%= sum %></p> 
    </form> 
 </body> 
</html>

routes/index.js:對提交的數(shù)據(jù)進行計算并推送結果

var express = require('express'); 
var router = express.Router(); 
 
/* GET home page. */ 
router.get('/', function(req, res, next) { 
 res.render('index', {  
  title: '計算器V1.0 by jdh', 
  numa: 0, 
    numb: 0, 
    sum: 0 
 }); 
}); 
 
router.post('/', function (req, res) { 
  console.log("接收:", req.body.num1, req.body.num2); 
  var sum = parseFloat(req.body.num1) + parseFloat(req.body.num2); 
  console.log('sum = ',sum); 
   
  res.render('index', {  
  title: '計算器V1.0 by jdh', 
// numa: req.body.num1, 
//   numb: req.body.num2 
    numa: req.body.num1, 
    numb: req.body.num2, 
    sum: sum 
 }); 
}); 
   
module.exports = router;

您可能感興趣的文章:

node.js安裝超詳細步驟教程(推薦!)
其實Node.js就是運行在服務端的JavaScript,Node.js是一個基于Chrome?JavaScript運行時建立的一個平臺,下面這篇文章主要給大家介紹了關于node.js安裝超詳細步驟教程的相關資料,需要的朋友可以參考下
2023-06-06
Node.js v8.0.0正式發(fā)布！看看帶來了哪些主要新特性
Node.js v8.0.0 已正式發(fā)布。v8.0.0 是下一個主要的版本，帶來了一系列重大的變化和新功能，內容十分多！下面這篇文章主要帶著大家一起看看Node.js v8.0.0帶來了哪些主要新特性，需要的朋友可以參考借鑒，下面來一起看看吧。
2017-06-06
Express+Nodejs 下的登錄攔截實現(xiàn)代碼
本篇文章主要介紹了Express+Nodejs 下的登錄攔截實現(xiàn)代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-07-07
Node環(huán)境中JS代碼缺少window對象的原因和解決方案
你可能會在某些情況下需要在Node環(huán)境下運行JavaScript代碼,但你也可能會遇到一個常見的問題：缺少window環(huán)境,在本文中,我們將深入探討這個問題的原因,并提供解決方案,需要的朋友可以參考下
2023-08-08
在nodejs中使用swagger方式
這篇文章主要介紹了在nodejs中使用swagger方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-09-09
nodejs中fs模塊三種讀寫文件方法的使用區(qū)別
Node.js的fs模塊有多種文件操作API,readFile、read、createReadStream讀取文件,writeFile、write、createWriteStream寫入文件,readFile和writeFile將文件寫入緩存區(qū),適合小文件操作,read和write分步驟讀寫,適合大文件,createReadStream和createWriteStream通過流處理文件
2024-10-10
Node Mongoose用法詳解【Mongoose使用、Schema、對象、model文檔等】
這篇文章主要介紹了Node Mongoose用法,結合實例形式分析了Mongoose使用、Schema、對象、model文檔等基本原理、用法及操作注意事項,需要的朋友可以參考下
2020-05-05
[將免費進行到底]在Amazon的一年免費服務器上安裝Node.JS, NPM和OurJS博客
此文是介紹如何在Amazon的一年免費計劃上安裝Node.JS, NPM還有搭建OurJS博客系統(tǒng)。,需要的朋友可以參考下
2014-08-08
nodeJs爬蟲的技術點總結
本篇文章給大家總結了關于nodeJs爬蟲的技術點的相關知識，對爬蟲有興趣的朋友可以跟著學習參考下。
2018-05-05
node.js中 cluster 模塊和 worker_threads 模塊示例
這篇文章主要介紹了node.js中 cluster 模塊和 worker_threads 模塊,本文通過示例代碼給大家介紹的非常詳細,需要的朋友可以參考下
2024-05-05