刚接触nodejs，写博客只是记录一下自己的学习心得
我这里的静态资源是指一个包括文字、图片、以及点击会有详情框的页面。需要2个js文件和一个html文件
- 首先新建一个01.js文件
const http = require('http');
var server = http.createServer();
const fs = require('fs');
server.on('request', function (res, rso) {
var urls = res.url;
if (urls == '/') {
rso.setHeader('Content-Type', 'text/html ;charset=utf-8');//设置编码 防止乱码
fs.readFile('./index.html', 'utf8', function (err, data) {
rso.end(data);
})
} else {
fs.readFile('.'+urls,(err,data)=>{ //因为图片是在当前目录下，而服务其返回的是/img/1.jpg，所以要添加一个“.”
rso.end(data);
})
}
});
server.listen(8081, function () {
console.log('Server running at http://127.0.0.1:8081/');
});
- 再建一个index.html,（---------不会html语言，只是举例，大佬勿喷-------）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
<p>shdsjhdjsk</p>
<p>shdsds</p>
<img src="./img/1.jpg" alt="">
<h2>cbxnzbczx</h2>
<p>fghgfhgfgh</p>
<i>nm,cnbv,n</i>
<s>u有风度与辐射</s>
</div>
</body>
<script src='./img/index.js'></script>//点击效果
</html>
- 再建一个index.js对应点击详情框效果
document.getElementsByTagName('img')[0].onclick=function () {
alert('好看');//括号中的img为对应上面index.html的标签，选择img，代表点击图片才有详情框，选择‘p’就要点击第一段文字
}
最终效果：
