nodejs 简单实现动态html的方法


Posted in NodeJs onMay 12, 2018

动态替换html内容

1.实现的功能及原理

实现了将,用户表单的数据,与html相结合,将用户输入的数据,显示到html对应的位置。

原理:通过正则表达式,替换html中的模板数据 如用户名{name},可以通过拿到用户提交的name的值value,通过

replace(正则表达式,value)的方式替换掉原模板数据,并输出到客户端。

2.主要用到的方法和模块

2.1文件操作模块 var fs=require("fs");

方法:

2.1.1 异步读取文件的方法

fs.readFile(path,callback);

参数说明:

path:文件的路径(包含文件名称)

callback:文件读取完毕的回调函数

文件读取的数据,从该方法获得,会自动填充

callback:function(err,data){
 if(err){
 //读取文件错误的逻辑
 }else{
 //对数据的操作,如打印
 console.log(data);
 }
 }

2.2 数据处理模块 var querystring=require("querystring");

方法:

2.2.1 将字符串转换成对象

querystring.parse(post);

2.3 post请求主要方法

监听有post数据上传的方法:request.on('data',funcation(chunk){
 //chunk post数据碎片
 });
 监听post数据上传完毕的方法:request.on('end',function(){
 //相关逻辑
 });

3.核心代码requestHandler.js

/*
 请求处理
 * */
//加载node非阻塞线程模块
//var exec=require("child_process").exec;
//加载queryString模块和文件上传模块
var http = require("http");
var formidable = require('formidable');
var fs = require("fs");
var path = require("path");
var querystring=require("querystring");
function login(request, response) {
var post="";
//监听post发送请求
request.on('data',function (chunk) {
post += chunk;
});
//数据接收完毕
request.on('end',function(){
post=querystring.parse(post);
/*替换的数据模板字段*/
var arr=["name","password"];
function recall (data) {
dataStr = data.toString();
//遍历模板字段
for (var i = 0; i < arr.length; i++) {
//全局替换
var re=new RegExp('{'+arr[i]+'}','g');
dataStr=dataStr.replace(re,post[arr[i]]);
}
response.writeHead(200, {"Content-Type": "text/html"});
response.write(dataStr);
response.end();
}
fs.readFile("login.html",function (err,data) {
recall(data);
});
});
}
function index (request, response) {
fs.readFile("login.html",function (err,data) {
if (err) {
throw err.toString();
} else{
response.writeHead(200, {"Content-Type": "text/html"});
response.write(data);
response.end();
}
})
}
exports.login = login;
exports.index=index;

4.html模板

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
用户名:{name}<br /> 
    <!--
  {name},{password}为要替换的模板字段
    -->
密 码:{password}<br />
<form action="/login" method="post">
<input type="text" name="name" /><br />
<input type="password" name="password" /><br />
<input type="submit" value="提交"/>
</form>
</body>
</html>

以上这篇nodejs 简单实现动态html的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

NodeJs 相关文章推荐
nodejs分页类代码分享
Jun 17 NodeJs
nodejs 实现钉钉ISV接入的加密解密方法
Jan 16 NodeJs
Express+Nodejs 下的登录拦截实现代码
Jul 01 NodeJs
Nodejs调用WebService的示例代码
Sep 29 NodeJs
nodejs中art-template模板语法的引入及冲突解决方案
Nov 07 NodeJs
nodejs async异步常用函数总结(推荐)
Nov 17 NodeJs
nodejs结合socket.io实现websocket通信功能的方法
Jan 12 NodeJs
Nodejs处理异常操作示例
Dec 25 NodeJs
详解NodeJS Https HSM双向认证实现
Mar 12 NodeJs
详解nodejs 开发企业微信第三方应用入门教程
Mar 12 NodeJs
nodejs实现百度舆情接口应用示例
Feb 07 NodeJs
详解nodejs内置模块
May 06 NodeJs
nodeJS服务器的创建和重新启动的实现方法
May 12 #NodeJs
Nodejs 和 Electron ubuntu下快速安装过程
May 04 #NodeJs
nodejs 日志模块winston的使用方法
May 02 #NodeJs
详解redis在nodejs中的应用
May 02 #NodeJs
nodejs读取并去重excel文件
Apr 22 #NodeJs
nodeJS模块简单用法示例
Apr 21 #NodeJs
NodeJS安装图文教程
Apr 19 #NodeJs
You might like
发挥语言的威力--融合PHP与ASP
2006/10/09 PHP
PHP程序漏洞产生的原因分析与防范方法说明
2014/03/06 PHP
php中define用法实例
2015/07/30 PHP
ThinkPHP3.2框架自带分页功能实现方法示例
2019/05/13 PHP
28个JS验证函数收集
2010/03/02 Javascript
HTML Dom与Css控制方法
2010/10/25 Javascript
JQuery实现倒计时按钮具体方法
2013/11/14 Javascript
js调试工具Console命令详解
2014/10/21 Javascript
jQuery实现转动随机数抽奖效果的方法
2015/05/21 Javascript
JavaScript通过事件代理高亮显示表格行的方法
2015/05/27 Javascript
JavaScript资源预加载组件和滑屏组件的使用推荐
2016/03/10 Javascript
JS添加或删除HTML dom元素的方法实例分析
2019/03/05 Javascript
详解使用React.memo()来优化函数组件的性能
2019/03/19 Javascript
20道JS原理题助你面试一臂之力(必看)
2019/07/22 Javascript
JavaScript设计模式--简单工厂模式实例分析【XHR工厂案例】
2020/05/23 Javascript
Python实现字典的key和values的交换
2015/08/04 Python
python实现石头剪刀布程序
2021/01/20 Python
基于wxPython的GUI实现输入对话框(1)
2019/02/27 Python
python中报错&quot;json.decoder.JSONDecodeError: Expecting value:&quot;的解决
2019/04/29 Python
Python实现电视里的5毛特效实例代码详解
2020/05/15 Python
Python高并发解决方案实现过程详解
2020/07/31 Python
利用CSS3实现毛玻璃效果示例源码
2016/09/25 HTML / CSS
CSS3中的Transition过度与Animation动画属性使用要点
2016/05/20 HTML / CSS
中国跨境电商:Tomtop
2017/03/16 全球购物
在对linux系统分区进行格式化时需要对磁盘簇(或i节点密度)的大小进行选择,请说明选择的原则
2012/11/24 面试题
金融与证券专业求职信
2014/06/22 职场文书
公司法人授权委托书范本
2014/09/12 职场文书
不服从上级领导安排的检讨书
2014/09/14 职场文书
2015年销售人员工作总结
2015/04/07 职场文书
研究生论文答辩开场白
2015/05/27 职场文书
老兵退伍感言
2015/08/03 职场文书
学术会议开幕词
2016/03/03 职场文书
十一月早安语录:把心放轻,人生就是一朵自在的云
2019/11/04 职场文书
PHP命令行与定时任务
2021/04/01 PHP
还在手动盖楼抽奖?教你用Python实现自动评论盖楼抽奖(一)
2021/06/07 Python
jupyter notebook保存文件默认路径更改方法汇总(亲测可以)
2021/06/09 Python