gpt4 book ai didi

javascript - 用nodejs和express读取css/js文件

转载 作者:行者123 更新时间:2023-11-30 12:04:53 25 4
gpt4 key购买 nike

在谈到 nodejs 时,我是一个真正的菜鸟,几天前就开始了。我不明白为什么我的 js 和 css 文件没有被应用。没有 404 错误,所以看起来不是这样。我正在尝试使用 express 读取文件。我在开发工具中收到这些控制台错误:

GamblerScript.js:1 未捕获的语法错误:意外的标记<

jquery-2.2.0.min.js:1 未捕获的语法错误:意外的标记<

localhost/:5 资源解释为样式表但使用 MIME 类型文本/html 传输:“http://localhost:8080/css/Stylesheet.css”。

(index):9 Uncaught ReferenceError: Run is not defined

有谁能看出我做错了什么吗?

var http = require('http');
var fs = require('fs');
var index = fs.readFileSync('index.html');
var express = require('express');
var app = express();

app.get('/', function(req, res) {
res.sendfile('/index.html');
});
app.use(express.static(__dirname + '/public'));

fs.readFile('./index.html', function (err, html) {
if (err) {
throw err;
}
http.createServer(function(request, response) {
response.writeHeader(200, {"Content-Type": "text/html"});
response.write(html);
response.end();
}).listen(8080);
});
<html lang="en">
<head>
<title>Dices</title>
<link rel="stylesheet" href="/css/Stylesheet.css">
<script src="/js/GamblerScript.js"></script>
<script src="/js/jquery-2.2.0.min.js"></script>
</head>
<body onload="Run();">
<div id="spinboxcontainer">
<div class="spinbox">
<span class="spinspan">Dices</span>
</div>
<div id="container">
<div id="spinner1" class="spinner">
<div id="D1.1" class="one">1</div>
<div id="D1.2" class="two">2</div>
<div id="D1.3" class="three">3</div>
<div id="D1.4" class="four">4</div>
<div id="D1.5" class="five">5</div>
<div id="D1.6" class="six">6</div>
</div>
</div>
<div id=container2>
<div id="spinner2" class="spinner">
<div id="D2.1" class="one">6</div>
<div id="D2.2" class="two">5</div>
<div id="D2.3" class="three">4</div>
<div id="D2.4" class="four">3</div>
<div id="D2.5" class="five">2</div>
<div id="D2.6" class="six">1</div>
</div>
</div>
</div>
</body>
</html>

function Run(){
alert('Welcome');
var clickNumber = 1;
document.getElementById('spinner1').addEventListener("click", function(){
alert('Your click is number ' + clickNumber + '!');
document.body.className -= ' WhiteBackground';
clickNumber = clickNumber + 1;
});

document.getElementById('spinner2').addEventListener("click", function(){
alert('Your click is number ' + clickNumber + '!');
document.body.className += ' WhiteBackground';
clickNumber = clickNumber + 1;
});
};

最佳答案

你搞砸了不同的方法。如果您使用 express,则无需 http.createServer 并使用 fs.readFile 手动读取您的静态文件。对于简单的静态服务器,只需像这样简化您的主文件

var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public'));
app.listen(8080, function() {console.log('server listening on port 8080...')})

你得到的错误是因为每当浏览器向服务器请求脚本文件如 jqueryGamblerScript 你的自定义 http 服务器将你的 index.html 文件发送回浏览器尝试像 javascript 一样执行它。

关于javascript - 用nodejs和express读取css/js文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35523417/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com