nodejs 简单实现动态html的方法
动态替换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抓取html页面内容（推荐）
- node.js 一个简单的页面输出实现代码
相关推荐
-
Nodejs抓取html页面内容（推荐）
废话不多说,直接给大家贴node.js抓取html页面内容的核心代码了. 具体代码如下所示: var http = require("http"); var iconv = require('iconv-lite'); var option = { hostname: "stockdata.stock.hexun.com", path: "/gszl/s601398.shtml" }; var req = http.request(option,
-
node.js 一个简单的页面输出实现代码
安装过程就不说了.如果成功是能使用node的命令.node.js调试是非常方便的.每种后台语言都有一个向那个黑黢黢的控制台团输出语用的命令.node.js沿用FF那套东西,也就是console对象与其方法.我们首先建一个example.js文件,内容如下,然后在控制台打开它. 复制代码 代码如下: console.log("hello node.js") for(var i in console){ console.log(i+" "+console[i]) } n
-
nodejs 简单实现动态html的方法
动态替换html内容 1.实现的功能及原理 实现了将,用户表单的数据,与html相结合,将用户输入的数据,显示到html对应的位置. 原理:通过正则表达式,替换html中的模板数据 如用户名{name},可以通过拿到用户提交的name的值value,通过 replace(正则表达式,value)的方式替换掉原模板数据,并输出到客户端. 2.主要用到的方法和模块 2.1文件操作模块 var fs=require("fs"); 方法: 2.1.1 异步读取文件的方法 fs.readFile
-
nodejs简单读写excel内容的方法示例
本文实例讲述了nodejs简单读写excel内容的方法.分享给大家供大家参考,具体如下: 支持读写Excel的node.js模块 node-xlsx: 基于Node.js解析excel文件数据及生成excel文件,仅支持xlsx格式文件: excel-parser: 基于Node.js解析excel文件数据,支持xls及xlsx格式文件: excel-export : 基于Node.js将数据生成导出excel文件,生成文件格式为xlsx: node-xlrd: 基于node.js从excel文
-
JS简单实现动态添加HTML标记的方法示例
本文实例讲述了JS简单实现动态添加HTML标记的方法.分享给大家供大家参考,具体如下: 一 介绍 动态添加一个HTML标记可以使用createElement()方法来实现. CreateElement()方法可以根据一个指定的类型来创建一个HTML标记. 语法: sElement=document.createElement(sName) sElement:用来接收该方法返回的一个对象. sName:用来设置HTML标记的类型和基本属性. 二 应用 动态添加一个文本框 本示例通过单击"动态添加文
-
JavaScript简单实现动态改变HTML内容的方法示例
本文实例讲述了JavaScript简单实现动态改变HTML内容的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JavaScript:改变 HTML 内容</title> <script> function myFunction() { x = document.getElementById(
-
nodejs简单访问及操作mysql数据库的方法示例
本文实例讲述了nodejs简单访问及操作mysql数据库的方法.分享给大家供大家参考,具体如下: var mysql = require('mysql'); //调用MySQL模块 mysql模块要安装 $ npm install mysql //创建一个connection var connection = mysql.createConnection({ host : '127.0.0.1', //主机 user : 'root', //MySQL认证用户名 password : '', /
-
使用jsp:include控制动态内容的方法
本文实例讲述了使用jsp:include控制动态内容的方法.分享给大家供大家参考,具体如下: 清单 1. JSP include 伪指令 <![CDATA[ <%@ page language="java" contentType="text/html" %> <html> <head> <title>newInstance.com</title> <meta http-equiv="
-
java 动态代理的方法总结
java 动态代理的方法总结 AOP的拦截功能是由java中的动态代理来实现的.说白了,就是在目标类的基础上增加切面逻辑,生成增强的目标类(该切面逻辑或者在目标类函数执行之前,或者目标类函数执行之后,或者在目标类函数抛出异常时候执行.不同的切入时机对应不同的Interceptor的种类,如BeforeAdviseInterceptor,AfterAdviseInterceptor以及ThrowsAdviseInterceptor等). 那么动态代理是如何实现将切面逻辑(advise)织入到目标类
-
asp.net 简单工厂模式和工厂方法模式之论述
简单工厂模式和工厂方法模式的区别 简单工厂模式的最大优点在于工厂类中包含了必要的逻辑判断,根据客户端的选择条件动态实例化相关的类,对于客户端来说,去除了于具体产品的依赖.而工厂方法模式定义了一个用于创建对象的借口,让子类决定实例化哪一个类,工厂方法是一个类的实例化延迟到其子类.其实多做一些联系不难发现:工厂方法模式实现时,客户端需要决定实例化那个工厂来实现运算类,选择判断的问题还是存在的,也即是说,工厂方法吧简单工厂的内部逻辑判断移到了客户端代码来进行,我想要加一些功能,本来是需要修改工厂类的,
-
JavaScript实现同步于本地时间的动态时间显示方法
本文实例讲述了JavaScript实现同步于本地时间的动态时间显示方法.分享给大家供大家参考.具体分析如下: 动态显示时间的例子非常简单,了解JavaScript之后就是几行的代码便能够完成的事情, 但是对于一些未接触过JavaScript的人来说,几乎很大工程的样子,然后在网上苦苦寻觅代码,之后在茫茫的html代码中寻求不到,最终得不到要领. 一.基本目标 实现一个随同客户端(浏览者机器上的)时间的网页文本时间,使用最短的代码. 二.制作过程 复制代码 代码如下: <!DOCTYPE html
-
一个简单的动态加载js和css的jquery代码
一个简单的动态加载js和css的jquery代码,用于在生成页面时通过js函数加载一些共通的js和css文件. //how to use the function below: //$.include('file/ajaxa.js');$.include('file/ajaxa.css'); //or $.includePath = 'file/';$.include(['ajaxa.js','ajaxa.css']);(only if .js and .css files are in the