Node.js之路径切换小案例
Posted 1/2的领土
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Node.js之路径切换小案例相关的知识，希望对你有一定的参考价值。
通过输入不同的路径信息，实现各个页面之间的切换
1、目录结构
2、服务器端代码
var http = require(\'http\');
var fs = require(\'fs\');file:///F:/前端/Node.js学习笔记/public
http.createServer(function(req,res){
var url = req.url;
if(url === \'/\'){
fs.readFile(\'./view/index.html\',function(err,data){
if(err){
return res.end(\'404 Not Found.\');
}else{
res.end(data);
}
});
}else if(url === \'/public/\'){
fs.readFile(\'./public/start.html\',function(err,data){
if(err){
return res.end(\'404 Not Found.\');
}else{
res.end(data);
}
});
}else{
fs.readFile(\'./public/404.html\',function(err,data){
if(err){
return res.end(\'404 Not Found.\');
}else{
res.end(data);
}
});
}
}).listen(3000,function(){
console.log("服务器启动成功")
});
3、各页面代码
3.1 index.html页面
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="/public/bootstrap/dist/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<hr>
<a href="/public/" class="btn btn-success">添加</a>
<hr>
<ul class="list-group">
{{each dataList}}
<li class="list-group-item">{{$value.name}}.Say:{{$value.message}}
<span class="pull-right">{{$value.date}}</span>
</li>
{{/each}}
</ul>
</div>
</body>
</html>
3.2 start页面代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <p>这是开始页面</p> <a href="/">返回最初页面</a> </body> <script type="text/javascript"> </script> </html>
3.3 not found页面代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> 404 不好意思，您访问的页面不存在..... </body> </html>
4.结果
4.1 初始页面：
4.2 点击添加后
4.3 点击返回最初页面后回到初始页面
4.4 当数据的url路径不存在时
以上是关于Node.js之路径切换小案例的主要内容，如果未能解决你的问题，请参考以下文章