实现多个页面跳转_html 打开多个网页代码-优快云博客

本文链接：https://blog.youkuaiyun.com/a_gust_wind/article/details/120894692

本文探讨了HTML中使用超链接进行页面跳转的实现方式，并着重分析了`content-type`设置对返回内容渲染的影响。在实际操作中，误设置为`html/text`会导致内容被下载而非正常渲染，而正确设置为`text/html;charset=utf-8`才能确保页面正常显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

01.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<p>我说的是付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付付</p>
		<div id="aa">点我跳转
			<a href="http://127.0.0.1:8000/back">点我</a>
		</div>
	</body>
</html>

02.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="aa">
			<p>吾问无为谓无无无无无无无无无无无无无无无无无无无无无无无无无</p>
		</div>
	</body>
</html>

01.js

const http = require('http')
const fs = require('fs')
let server = http.createServer();
server.on('request',function(req,res){
	if(req.url=='/back'){
		fs.readFile('./02.html',function(err,data){
			// res.setHeader('content-type','text/html;charset=utf-8');
			res.end(data)
		})
	}
	else if(req.url=='/'){
		fs.readFile('./01.html',function(err,data){
			// res.setHeader('content-type','html/text;charset=utf-8');
			if(err){console.log(err)}
			res.end(data)
		})
	}
	else if(req.url=='/favicon.ico'){
		res.end()
	}
	else{
		fs.read('.'+req.url,function(err,data){
			res.end(data)
		})
	}
})

server.listen(8000,function(){
	console.log('启动')
})

总结:页面跳转用超链接

<a href="http://127.0.0.1:8000/back">点我</a>

出现的问题：
content-type 设置为 html/text 返回的是个下载的文本文件，没有渲染成网页res.setHeader(‘content-type’,‘html/text;charset=utf-8’);

res.setHeader(‘content-type’,‘text/html;charset=utf-8’);设置成这个才是返回的网页不设置的话默认也渲染成网页