否则，如果语句获胜'；在字符串中查找子字符串时，不能在JavaScript上执行
我正在尝试用HTML和JS编写刽子手游戏。大部分代码按预期工作。然后我被卡住了。 不知何故，我无法让if-else语句的一部分起作用。 代码行：否则，如果语句获胜'；在字符串中查找子字符串时，不能在JavaScript上执行,javascript,html,Javascript,Html,我正在尝试用HTML和JS编写刽子手游戏。大部分代码按预期工作。然后我被卡住了。 不知何故，我无法让if-else语句的一部分起作用。 代码行： }else if（word.includes（userChar））{ 当代码的类似部分出现以下情况时，将不会执行： }else if（猜测字母.包括（userChar））{ 执行。我缺少什么 <!DOCTYPE html> <html lang="en"> <head> &
- }else if（word.includes（userChar））{
- }else if（猜测字母.包括（userChar））{
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hangman</title>
<style>
*{
background-color: bisque;
font-family: Arial, Helvetica, sans-serif;
font-size: xx-large;
font-weight: 700;
text-transform: uppercase;
}
canvas{
background-color: antiquewhite;
box-shadow: 10px 10px 5px #aaaaaa;
border-radius: 30px;
}
button{
background-color: antiquewhite;
box-shadow: 4px 4px 3px #aaaaaa;
border-radius: 10px;
border-radius: 30px;
padding: 10px;
padding-right: 15px;
padding-left: 15px;
}
input{
border-radius: 30px;
padding: 7px;
}
.label{
color: rgb(11, 11, 116);
}
#userInput{
text-align: center;
}
#messages{
text-align: center;
}
</style>
</head>
<body>
<table border="0" width="100%">
<tr>
<td colspan="2">
<p align="center"> Hangman</td>
</tr>
<tr>
<td width="240px">
<canvas id="myCanvas" width="200" height="300"></canvas>
</td>
<td>
<table border="0" width="100%">
<tr>
<td width="10%" align="right" class="label"> Word:</td>
<td width="90%" id="word"> _ _ _ _ _ _ _ _ _ _</td>
</tr>
<tr>
<td width="10%" align="right" class="label"> Guess:</td>
<td width="90%" id="guess">
<input type="text" id="userInput" maxlength="1" size="1" autocomplete="off" autofocus>
<button type="button" onclick="testLetter()" id="okButton">OK</button>
</td>
</tr>
<tr>
<td width="10%" align="right" class="label"> Guessed:</td>
<td width="90%" id="miss"> </td>
</tr>
<tr>
<td width="10%" align="right" class="label"> Left:</td>
<td width="90%" id="left"> 7</td>
</tr>
<tr>
<td width="10%" align="right" class="label"> </td>
<td width="90%" id="newGame">
<button type="button" onClick="window.location.reload();" id="newGame">New Game</button></td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2" id="messages">Guess a letter in the word!
<p align="center"> </td>
</tr>
</table>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var guessNumber = 0;
var wrongGuesses = 0; // for drawing
var emptyWord = "__________";
var alphabet = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L",
"M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"];
var englishAlphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var missedLetters = [];
var guessedLetters = "";
var words = ["axtenvtsey", "herxtyeswy", "ywxgeysyhe"];
var word = words[Math.floor(Math.random()*words.length)];
console.log(word);
var userChar = "";
function testLetter(){
var userChar = document.getElementById("userInput").value.toUpperCase();
console.log(userChar);
document.getElementById('userInput').value = "";
document.getElementById("userInput").focus();
if(userChar == "" || userChar == " "){
document.getElementById("messages").innerHTML = "Insert Character!";
} else if(!(englishAlphabet.includes(userChar))){
document.getElementById("messages").innerHTML = "Illegal Character!";
} else if (guessedLetters.includes(userChar)){
document.getElementById("messages").innerHTML = "Already Selected!";
} else if (word.includes(userChar)){
console.log("This letter is in gessing word!");
for (char in word){
if (char == userChar){
emptyWord += word[char] + " ";
}
}
console.log(emptyWord);
document.getElementById("word").innerHTML = word;
document.getElementById("messages").innerHTML = "Good Guess!";
guessedLetters += userChar;
document.getElementById("miss").innerHTML = guessedLetters;
} else {
console.log(word);
console.log(typeof(word));
console.log(userChar);
console.log(typeof(userChar));
console.log(emptyWord);
document.getElementById("messages").innerHTML = "Bad Guess!";
wrongGuesses += 1;
drawing(wrongGuesses);
guessedLetters += userChar;
document.getElementById("left").innerHTML = 7 - wrongGuesses;
document.getElementById("miss").innerHTML = guessedLetters;
}
}
function drawing(wrongGuesses){
if(wrongGuesses == 1){
// hanger
ctx.lineWidth = 7;
ctx.moveTo(20, 260);
ctx.lineTo(180, 260);
ctx.moveTo(160, 260);
ctx.lineTo(160, 50);
ctx.lineTo(80, 50);
ctx.lineTo(80, 60);
ctx.stroke();
}
if(wrongGuesses == 2){
// head
ctx.lineWidth = 3;
ctx.beginPath();
ctx.arc(80, 70, 10, 0, 2 * Math.PI);
ctx.stroke();
}
if(wrongGuesses == 3){
// body
ctx.moveTo(80, 80);
ctx.lineTo(80, 140);
ctx.stroke();
}
if(wrongGuesses == 4){
// right arm
ctx.moveTo(80, 90);
ctx.lineTo(50, 110);
ctx.stroke();
}
if(wrongGuesses == 5){
// left arm
ctx.moveTo(80, 90);
ctx.lineTo(110, 110);
ctx.stroke();
}
if(wrongGuesses == 6){
// right leg
ctx.moveTo(80, 140);
ctx.lineTo(50, 170);
ctx.stroke();
}
if(wrongGuesses == 7){
// left leg
ctx.moveTo(80, 140);
ctx.lineTo(110, 170);
ctx.stroke();
document.getElementById("okButton").style.visibility = "hidden";
document.getElementById("messages").innerHTML = "Game Over!";
}
}
</script>
</body>
</html>
刽子手
*{
背景色：深蓝色；
字体系列：Arial、Helvetica、无衬线字体；
字体大小：xx大号；
字号：700；
文本转换：大写；
}
帆布{
背景色：仿古白色；
盒影：10px 10px 5px#aaaaa；
边界半径：30px；
}
钮扣{
背景色：仿古白色；
箱形阴影：4px 4px 3px#aaaaa；
边界半径：10px；
边界半径：30px；
填充：10px；
右侧填充：15px；
左侧填充：15px；
}
输入{
边界半径：30px；
填充：7px；
}
.标签{
颜色：rgb（11,11,116）；
}
#用户输入{
文本对齐：居中；
}
#信息{
文本对齐：居中；
}
刽子手
字：
_ _ _ _ _ _ _ _ _ _
猜测：
好啊
猜测：
左：
7.
新游戏
猜猜单词中的一个字母！
var c=document.getElementById（“myCanvas”）；
var ctx=c.getContext（“2d”）；
var guessNumber=0；
var errogesses=0；//用于绘图
var emptyWord=“\uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu”；
变量字母表=[“A”、“B”、“C”、“D”、“E”、“F”、“G”、“H”、“I”、“J”、“K”、“L”，
“M”、“N”、“O”、“P”、“Q”、“R”、“S”、“T”、“U”、“V”、“W”、“X”、“Y”、“Z”]；
var englishAlphabet=“abcdefghijklmnopqrstuvxyz”；
var missedLetters=[]；
var guessedLetters=“”；
var words=[“axtenvtsey”、“herxtyeswy”、“ywxgeysyhe”]；
var word=words[Math.floor（Math.random（）*words.length）]；
console.log（word）；
var userChar=“”；
函数testLetter（）{
var userChar=document.getElementById（“userInput”）.value.toUpperCase（）；
log（userChar）；
document.getElementById（'userInput'）。value=“”；
document.getElementById（“userInput”）.focus（）；
如果（userChar==“”| | userChar==“”）{
document.getElementById（“消息”）.innerHTML=“插入字符！”；
}如果（！（englishAlphabet.includes（userChar）），则为else{
document.getElementById（“消息”）.innerHTML=“非法字符！”；
}else if（猜测字母.包括（userChar））{
document.getElementById（“消息”）.innerHTML=“已选择！”；
}else if（word.includes（userChar））{
log（“这封信是用格辛单词写的！”）；
for（word中的字符）{
if（char==userChar）{
空字+=字[char]+“”；
}
}
控制台日志（emptyWord）；
document.getElementById（“word”）.innerHTML=word；
document.getElementById（“messages”）.innerHTML=“猜得好！”；
猜字母+=用户字符；
document.getElementById（“miss”）.innerHTML=guessedLetters；
}否则{
console.log（word）；
console.log（type of（word））；
log（userChar）；
log（typeof（userChar））；
控制台日志（emptyWord）；
document.getElementById（“messages”）.innerHTML=“猜错了！”；
错误猜测+=1；
绘画（猜错）；
猜字母+=用户字符；
document.getElementById（“左”）.innerHTML=7-错误猜测；
document.getElementById（“miss”）.innerHTML=guessedLetters；
}
}
功能图（错误猜测）{
如果（错误猜测==1）{
//衣架
ctx.lineWidth=7；
ctx.moveTo（20260）；
ctx.lineTo（180260）；
ctx.moveTo（160260）；
ctx.lineTo（160,50）；
ctx.lineTo（80,50）；
ctx.lineTo（80,60）；
ctx.stroke（）；
}
如果（错误猜测==2）{
//头
ctx.lineWidth=3；
ctx.beginPath（）；
ctx.arc（80,70,10,0,2*Math.PI）；
ctx.stroke（）；
}
如果（错误猜测==3）{
//身体
ctx.moveTo（80,80）；
ctx.lineTo（80140）；
ctx.stroke（）；
}
如果（错误猜测==4）{
//右臂
ctx.moveTo（80,90）；
ctx.lineTo（50110）；
else if (word.includes(userChar.toLowerCase())){ //Compare with lowercase input
var englishAlphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var words = ["axtenvtsey", "herxtyeswy", "ywxgeysyhe"];
word = word.toUpperCase();