所以我在玩JavaScript，遇到了一个问题。我试着让两个按钮更改上面的文字，根据已经写的内容，更改会有所不同。只有4种可能的选择。所以我想的是用一个if和else if来使它起作用。但它没有起作用。然后在接下来的几个小时里，我一遍又一遍地检查，但都没能成功。最后，我想出了一个主意，使它发挥了作用，但我不知道为什么。
以上内容很长，所以如果你想跳过它，请阅读以下内容： 为什么a(有效而b(TR
第一个我的HTML:
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<link rel="stylesheet" type="text/css" href="stylesheets.css">
<script rel="javascript" src="script.js"></script>
</head>
<body onload="boopFunction()">
<h1 id="boop"></h1>
<button onclick="ggFunction()">Leave
</button>
<button onclick="eeFunction()">Enter</button>
</body>
</html>
然后什么起作用了，a(：
var Boop = document.getElementById("boop");
/* onload welcome */
function boopFunction() {
document.getElementById("boop").innerHTML = Poob[4];
Boop = Poob[4];
}
/* leave button */
function ggFunction() {
if (Boop == Poob[0]) {
document.getElementById("boop").innerHTML = Poob[1];
Boop = Poob[1];
}
else if (Boop == Poob[2]) {
document.getElementById("boop").innerHTML = Poob[1];
Boop = Poob[1];
}
else if (Boop == Poob[1]) {
document.getElementById("boop").innerHTML = Poob[3];
Boop = Poob[3];
}
else if (Boop == Poob[4]) {
document.getElementById("boop").innerHTML = Poob[1];
Boop = Poob[1];
}
}
/* enter button */
function eeFunction() {
if (Boop == Poob[1]) {
document.getElementById("boop").innerHTML = Poob[0];
Boop = Poob[0];
}
else if (Boop == Poob[3]) {
document.getElementById("boop").innerHTML = Poob[0];
Boop = Poob[0];
}
else if (Boop == Poob[0]) {
document.getElementById("boop").innerHTML = Poob[2];
Boop = Poob[2];
}
else if (Boop == Poob[4]) {
document.getElementById("boop").innerHTML = Poob[0];
Boop = Poob[0];
}
}
最后什么不起作用，b(：
var Poob = ["Welcome!", "Goodbye!", "You're still here?", "You're still outside!", "Hello there!"];
var Boop = document.getElementById("boop");
/* onload welcome */
function boopFunction() {
document.getElementById("boop").innerHTML = Poob[4];
}
/* leave button */
function ggFunction() {
if (Boop == Poob[0]) {
document.getElementById("boop").innerHTML = Poob[1];
}
else if (Boop == Poob[2]) {
document.getElementById("boop").innerHTML = Poob[1];
}
else if (Boop == Poob[1]) {
document.getElementById("boop").innerHTML = Poob[3];
}
else if (Boop == Poob[4]) {
document.getElementById("boop").innerHTML = Poob[1];
}
}
/* enter button */
function eeFunction() {
if (Boop == Poob[1]) {
document.getElementById("boop").innerHTML = Poob[0];
}
else if (Boop == Poob[3]) {
document.getElementById("boop").innerHTML = Poob[0];
}
else if (Boop == Poob[0]) {
document.getElementById("boop").innerHTML = Poob[2];
}
else if (Boop == Poob[4]) {
document.getElementById("boop").innerHTML = Poob[0];
}
}
更新：感谢您的帮助！这更有意义！这是我用你们给我的信息将其更改为的代码(尽管这真的只是为了好玩，这就是为什么它是随机的(
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<link rel="stylesheet" type="text/css" href="stylesheets.css">
<script rel="javascript" src="script.js"></script>
</head>
<body onload="olFunction()">
<h1 id="banner"></h1>
<button onclick="leaveFunction()">Leave
</button>
<button onclick="enterFunction()">Enter</button>
</body>
</html>
JavaScript:
var Poof = ["Welcome!", "Goodbye!", "You're still here?", "You're still outside!", "Hello there!"];
var Crash = Poof[4];
/* onload */
function olFunction() {
document.getElementById("banner").innerHTML = Crash;
}
/* leave button */
function leaveFunction() {
if (Crash == Poof[0]) {
Crash = Poof[1];
}
else if (Crash == Poof[2]) {
Crash = Poof[1];
}
else if (Crash == Poof[1]) {
Crash = Poof[3];
}
else if (Crash == Poof[4]) {
Crash = Poof[1];
}
document.getElementById("banner").innerHTML = Crash;
}
/* enter button */
function enterFunction() {
if (Crash == Poof[1]) {
Crash = Poof[0];
}
else if (Crash == Poof[3]) {
Crash = Poof[0];
}
else if (Crash == Poof[0]) {
Crash = Poof[2];
}
else if (Crash == Poof[4]) {
Crash = Poof[0];
}
document.getElementById("banner").innerHTML = Crash;
}
理性很容易。因为你有两个函数，每个函数都不包含else条件。初始化您的数据是html元素
document.getElementById("boop");
所以你没有进入任何条件，所以什么都不起作用。这里你应该使用
document.getElementById("boop").innerHTML;
作为解决方案，您将像您的工作示例一样给出初始化值，或者添加else语句，并在其中给出预期值