错误：jQuery需要一个带有文档的窗口。使用ejs和javascript创建hangman网络应用]] << [
我想访问js文件中的值“ guessed”以从div中删除类“ lettercolor”，以便正确猜测的字母以默认黑色显示。如果另一个js文件可以保存猜测的值，我可以这样做，但是我也不知道如何将app.js的“猜测”值传递给另一个js文件。请提出建议更改或改进。index.ejs
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Hangman</title>
<link rel="stylesheet" href=".3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css">
<link href="+Start+2P&display=swap" rel="stylesheet">
</head>
<body>
<h1>HANGMAN</h1>
<div class="container-fluid">
<div class="row">
<% letterList.forEach(function(letter){ %>
<div id=<%= letter %> class="col-lg-1 col-md-3 col-sm-4 letters lettercolor"><%= letter %></div>
<% }); %>
</div>
</div>
<form method="post">
<input type="text" name="answer" value=""><br>
<button type="submit" name="button">Go!</button>
</form>
<script src=".1.1/jquery.min.js"></script>
</body>
</html>
APP.JS
const express = require('express');
const randomWords = require('random-words');
const bodyParser = require('body-parser');
const ejs = require('ejs');
const $ = require('jquery')
const app = express();
const letterList = (randomWords().split(''))
const guessed = []
let count = 0
app.set('view engine', 'ejs');
app.use(bodyParser.urlencoded({extended:true}));
app.use(express.static("public"));
app.get("/", function(req, res){
res.render("index", {letterList: letterList, guessed: guessed});
});
app.post("/", function(req, res){
console.log(letterList)
let letter = req.body.answer;
if(letterList.includes(letter)){
console.log("You're correct!");
count += 1
remove(letterList, letter)
guessed.push(letter)
$('#' + guessed[guessed.length - 1]).removeClass('lettercolor');
console.log(guessed);
}
else{
console.log("Wrong!");
}
});
app.listen(3000, function(req, res){
console.log("Server running on port 3000");
});
function remove(arr) {
var what, a = arguments, L = a.length, ax;
while (L > 1 && arr.length) {
what = a[--L];
while ((ax= arr.indexOf(what)) !== -1) {
arr.splice(ax, 1);
}
}
return arr;
}
STYLES.CSS
body{
background-color: gray;
text-align: center;
}
h1{
text-align: center;
font-family: 'Press Start 2P', cursive;
font-size: 50px;
letter-spacing: 8px;
}
input{
height: 100px;
width: 100px;
font-size: 60px;
text-align: center;
text-transform: uppercase;
}
.container-fluid{
width: 80%;
text-align: center;
}
.row{
display: inline-block;
}
.letters{
background-color: ivory;
user-select: none;
border-radius: 10%;
margin: 20px;
height: 70px;
width: 70px;
font-size: 45px;
text-transform: uppercase;
}
.lettercolor {
color: ivory;
}
我想访问js文件中的值“ guessed”以从div中删除类“ lettercolor”，以便正确猜测的字母以默认黑色显示。如果另一个js文件...回答如下：NodeJS在您的服务器上运行，而不在浏览器上运行。当您尝试操纵节点服务器无法直接控制的DOM时，与DOM / Document相关的任何操作自然都会失败。这是在浏览器和服务器端运行JavaScript之间的基本区别之一。 JQuery将仅在浏览器中工作。但是您的节点服务器可以呈现HTML并将其发送到浏览器，这就是ejs所做的，被称为模板引擎。
错误：jQuery需要一个带有文档的窗口。使用ejs和javascript创建hangman网络应用]] << [
我想访问js文件中的值“ guessed”以从div中删除类“ lettercolor”，以便正确猜测的字母以默认黑色显示。如果另一个js文件可以保存猜测的值，我可以这样做，但是我也不知道如何将app.js的“猜测”值传递给另一个js文件。请提出建议更改或改进。index.ejs
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Hangman</title>
<link rel="stylesheet" href=".3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css">
<link href="+Start+2P&display=swap" rel="stylesheet">
</head>
<body>
<h1>HANGMAN</h1>
<div class="container-fluid">
<div class="row">
<% letterList.forEach(function(letter){ %>
<div id=<%= letter %> class="col-lg-1 col-md-3 col-sm-4 letters lettercolor"><%= letter %></div>
<% }); %>
</div>
</div>
<form method="post">
<input type="text" name="answer" value=""><br>
<button type="submit" name="button">Go!</button>
</form>
<script src=".1.1/jquery.min.js"></script>
</body>
</html>
APP.JS
const express = require('express');
const randomWords = require('random-words');
const bodyParser = require('body-parser');
const ejs = require('ejs');
const $ = require('jquery')
const app = express();
const letterList = (randomWords().split(''))
const guessed = []
let count = 0
app.set('view engine', 'ejs');
app.use(bodyParser.urlencoded({extended:true}));
app.use(express.static("public"));
app.get("/", function(req, res){
res.render("index", {letterList: letterList, guessed: guessed});
});
app.post("/", function(req, res){
console.log(letterList)
let letter = req.body.answer;
if(letterList.includes(letter)){
console.log("You're correct!");
count += 1
remove(letterList, letter)
guessed.push(letter)
$('#' + guessed[guessed.length - 1]).removeClass('lettercolor');
console.log(guessed);
}
else{
console.log("Wrong!");
}
});
app.listen(3000, function(req, res){
console.log("Server running on port 3000");
});
function remove(arr) {
var what, a = arguments, L = a.length, ax;
while (L > 1 && arr.length) {
what = a[--L];
while ((ax= arr.indexOf(what)) !== -1) {
arr.splice(ax, 1);
}
}
return arr;
}
STYLES.CSS
body{
background-color: gray;
text-align: center;
}
h1{
text-align: center;
font-family: 'Press Start 2P', cursive;
font-size: 50px;
letter-spacing: 8px;
}
input{
height: 100px;
width: 100px;
font-size: 60px;
text-align: center;
text-transform: uppercase;
}
.container-fluid{
width: 80%;
text-align: center;
}
.row{
display: inline-block;
}
.letters{
background-color: ivory;
user-select: none;
border-radius: 10%;
margin: 20px;
height: 70px;
width: 70px;
font-size: 45px;
text-transform: uppercase;
}
.lettercolor {
color: ivory;
}
我想访问js文件中的值“ guessed”以从div中删除类“ lettercolor”，以便正确猜测的字母以默认黑色显示。如果另一个js文件...回答如下：NodeJS在您的服务器上运行，而不在浏览器上运行。当您尝试操纵节点服务器无法直接控制的DOM时，与DOM / Document相关的任何操作自然都会失败。这是在浏览器和服务器端运行JavaScript之间的基本区别之一。 JQuery将仅在浏览器中工作。但是您的节点服务器可以呈现HTML并将其发送到浏览器，这就是ejs所做的，被称为模板引擎。