Javascript 将CSS链接到nodejs服务器的HTML_Javascript_Html_Css_Node.js

Javascript 将CSS链接到nodejs服务器的HTML

javascript html css node.js

Javascript 将CSS链接到nodejs服务器的HTML,javascript,html,css,node.js,Javascript,Html,Css,Node.js,我正在尝试将style.css文件链接到hello.html页面，以便使用nodejs在本地主机中显示。但是输出仅用html格式化，不显示css样式这是我的密码 project.js var http = require('http'); var fs = require('fs'); http.createServer(function (req,res){ fs.readFile('hello.html',function(err,data){ res.writeHead

我正在尝试将style.css文件链接到hello.html页面，以便使用nodejs在本地主机中显示。但是输出仅用html格式化，不显示css样式

这是我的密码

project.js

var http = require('http');
var fs = require('fs');

http.createServer(function (req,res){
    fs.readFile('hello.html',function(err,data){
    res.writeHead(200,{'Content-Type': 'text/html'});
    res.write(data);
    res.end();
  });

}).listen(8080);

#heading{
    color:green;
    font-family: sans-serif,serif;
}

#bt{
 background-color: #4CAF50;
color: #ffffff;
border-color: #4CAF50;
}

hello.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="heading">
    <h1>FILE UPLOADING!</h1>
</div>

<form method= "POST" enctype="multipart/form-data" action="fileupload">
<input type="file" name="filetoupload">
<input type="submit" id='bt' value="Submit">
</form>


</body>
</html>

您可以参考下面的链接，也可以使用http提供css文件。代码：

你可以试试这个

var http=require（'http'））
var fs=require（'fs'）
http.createServer（函数（req，res）{
让route=req.url.replace（'/'，''）
让请求_url=route==''| | route==='/'？'hello.html'：路由
console.log（请求url）
fs.exists（请求url，（exist）=>{
if（布尔值（存在）==false）{
res.writeHead（404，{'content-type'：'text/html'}）
res.end（'未找到页面'）
返回空
}
读取文件（请求url、函数（错误、数据）{
文书标题（200）
res.write（数据）
决议结束（）
})
})
}).listen（8080）

您的HTML代码中是否需要CSS文件？如果是这种情况，浏览器会将其请求给Node，Node必须为其提供服务并将其发送给浏览器。是。。检查html代码。我已经链接了css文件。但是不起作用。styles.css是否与html文件存在于同一目录中？是的。。相同的目录..html在不在本地主机中查看时与css一起工作。。所以基本上我想知道为什么它在使用nodejs的localhost上不起作用，因为您没有这样的路由。节点是低级的，它不想变得“聪明”或任何东西。它正在做你让它做的事情。您正在请求一个CSS文件，但没有编写任何指令（没有路由，没有文件夹指示）来处理此请求。现在使用Express很容易（这甚至是Express的全部要点），但在没有Express的纯节点中，我不知道如何操作。@sreekant shenoy让ans知道并批准它是否适合您：）此外，您还可以使用Express来提高路由灵活性，正如@Jeremy Thille在评论中明确提到的，因为这看起来是一个非常冗长和烦人的处理路线的方法。谢谢大家！它起作用了。。我也会用express学习。：）@你能接受我的回答吗

            var http = require('http');
            var fs = require('fs');

            http.createServer(function (req,res){
                if(req.url === '/hello.html') {
                fs.readFile('hello.html',function(err,data){
                res.writeHead(200,{'Content-Type': 'text/html'});
                res.write(data);
                res.end();
              });
                }
                else if(req.url === '/style.css') {
                fs.readFile('style.css',function(err,data){
                res.writeHead(200,{"Content-Type": "text/css"});
                res.write(data);
                res.end();
                });
                }

            }).listen(8080);