Javascript 为什么我的代码总是选择相同的数组项？_Javascript_Arrays

Javascript 为什么我的代码总是选择相同的数组项？

javascript arrays

Javascript 为什么我的代码总是选择相同的数组项？,javascript,arrays,Javascript,Arrays,我是一个学生，我的HTML代码有问题。我的任务是使用代码中的数组创建一个红绿灯序列，该数组在每次单击按钮后推进红绿灯序列。它通过操纵网页上的单个图像来实现这一点但是，按下按钮后，它只会将灯光更改为其“RedAmberLight”状态。代码已粘贴在下面，如有任何帮助，将不胜感激： <!DOCTYPE html> <html> <body> <h1>Changing Traffic Lights w/ Arrays</h1> <

我是一个学生，我的HTML代码有问题。我的任务是使用代码中的数组创建一个红绿灯序列，该数组在每次单击按钮后推进红绿灯序列。它通过操纵网页上的单个图像来实现这一点

但是，按下按钮后，它只会将灯光更改为其

“RedAmberLight”

状态。代码已粘贴在下面，如有任何帮助，将不胜感激：

<!DOCTYPE html>
<html>
<body>

<h1>Changing Traffic Lights w/ Arrays</h1>

<img id="trafficLight" src="RedLight.jpg">
<button type="button" onclick="lightChange()">Change Traffic Lights</button>

<script>

var fileArray = ["RedLight.jpg",
                 "RedAmberLight.jpg",
                 "GreenLight.jpg",
                 "AmberLight.jpg"];

function lightChange() {
  var lightColour = trafficLight.src

  if (lightColour = fileArray[0]) {
     lightColour = fileArray[1];
  } else if (lightColour = fileArray[1]) {
     lightColour = fileArray[2];
  } else if (lightColour = fileArray[2]) {
     lightColour = fileArray[3]; 
  } else {
     lightColour = fileArray[0];
  }
  var light = document.getElementById('trafficLight');
  light.src = lightColour
}

</script>

</body>
</html>


更换带有阵列的交通灯
改变交通灯
var fileArray=[“RedLight.jpg”，
“RedAmberLight.jpg”，
“GreenLight.jpg”，
“AmberLight.jpg”]；
函数lightChange（）{
var lightcolor=trafficLight.src
if（lightcolor=fileArray[0]）{
LightColor=fileArray[1]；
}else if（lightcolor=fileArray[1]）{
LightColor=fileArray[2]；
}else if（lightcolor=fileArray[2]）{
LightColor=fileArray[3]；
}否则{
LightColor=fileArray[0]；
}
var light=document.getElementById（'trafficLight'）；
light.src=lightcolor
}

问题：

if（lightcolor=fileArray[0]）{

这是一项作业，不是测试

使用double/triple

：

lightcolor==fileArray[0]）

解决问题：

if（lightcolor=fileArray[0]）{

这是一项作业，不是测试

使用double/triple

：

lightcolor==fileArray[0]）

您需要使用

或

运算符而不是

来比较值。否则，您只需分配值并测试结果是“假”还是“真”（一个JavaScript概念，用于测试空字符串、0等是否可用）

您需要使用

或

==

运算符而不是

来比较值。否则，您只需分配值并测试结果是“falsy”还是“truthy”（测试空字符串、0等的JavaScript概念）

少一些if语句怎么样？看看这个

var fileArray=[
“RedLight.jpg”，
“RedAmberLight.jpg”，
“GreenLight.jpg”，
“AmberLight.jpg”
];
函数lightChange（）{
var lightcolor=trafficLight.innerHTML；
var lightIndex=fileArray.indexOf（lightcolor）；
LightColor=fileArray[lightIndex+1==fileArray.length？0:lightIndex+1]；
var light=document.getElementById（'trafficLight'）；
light.innerHTML=lightcolor；
}

使用阵列更改交通灯
RedLight.jpg
更改交通灯

减少if语句如何？请查看此项

var fileArray=[
“RedLight.jpg”，
“RedAmberLight.jpg”，
“GreenLight.jpg”，
“AmberLight.jpg”
];
函数lightChange（）{
var lightcolor=trafficLight.innerHTML；
var lightIndex=fileArray.indexOf（lightcolor）；
LightColor=fileArray[lightIndex+1==fileArray.length？0:lightIndex+1]；
var light=document.getElementById（'trafficLight'）；
light.innerHTML=lightcolor；
}

使用阵列更改交通灯
RedLight.jpg
更改红绿灯首先，您依赖元素，元素确实如此，但这不是一个好的做法。其次，元素src
属性返回整个URL，即绝对路径。第三，使用两个或三个等号进行比较。这不是您要问的，但如果使用变量保持tr，则逻辑可以简化确认数组中的当前索引，然后代替整个if/else if/else块，您可以说类似于currentIndex++；if（currentIndex==fileArray.length）{currentIndex=0}light.src=fileArray[currentIndex]
。我感谢您的反馈。我一定会记住您的评论，以备将来使用……首先，您依赖元素，元素确实如此，但这不是一个好的做法。其次，元素src
属性返回整个URL，即绝对路径。第三，比较是用两个或三个等号完成的。这不是您所要求的，但是，如果您使用一个变量来跟踪数组中的当前索引，那么可以简化逻辑，而不是整个if/else if/else块，您可以说类似于currentIndex++；if（currentIndex==fileArray.length）{currentIndex=0}light.src=fileArray[currentIndex]。我感谢您的反馈。我一定会记住您的评论，以备将来……”结果是否为“truthy”（测试空字符串、0等的JavaScript概念）-这些例子都是虚假的值…@nnnnnn-Oops。是的，我的措辞很糟糕。谢谢你。我只是需要改变一些事情，并根据你的建议，使代码功能正确…”结果是否为“truthy”（一个测试空字符串、0等的JavaScript概念）-那些例子都是虚假的值…@nnnnnn-Oops。是的，我的措辞很糟糕。谢谢你。我只是需要改变一些东西，并且，根据你的建议，我能够使代码正确运行…只是想知道，双等号和三等号之间有什么区别吗？@SankarshMakam只是想知道，它们之间有什么区别吗双等号和三等号？@SankarshMakam谢谢你的帮助；这实际上让我的代码正常工作了……显然你不必这么做，但如果你可以，如果你能解释一下你在代码中添加的每一行内容，我将不胜感激。好了！我希望解释得很好。谢谢你的帮助；这实际上是我的cod如果你能解释一下你添加的每一行代码都做了些什么，我将不胜感激。好了！我希望你能解释清楚。
if (lightColour === fileArray[0]) {
   lightColour = fileArray[1];
} else if (lightColour === fileArray[1]) {
   lightColour = fileArray[2];
} else if (lightColour === fileArray[2]) {
   lightColour = fileArray[3]; 
} else {
   lightColour = fileArray[0];
}