使用Javascript实现图像滚动

我这样做是为了我下周要交的作业。 我们的讲师希望我们创建图像翻转。我已经创建了一个，但它不起作用。 这是我的密码：

<script>
function turnSwitchOn(img) {
    buttonImg="lab11-1switchon.jpg"
    document.getElementById(lightswitch).src=buttonImg
}
function turnSwitchOff(img) {
    buttonImg="lab11-1switchoff.jpg"
    document.getElementById(lightswitch).src=buttonImg
}
</script>

功能接通（img）{
buttonImg=“lab11-1switch.jpg”
document.getElementById（lightswitch）.src=buttonImg
}
功能关闭（img）{
buttonImg=“lab11-1switchoff.jpg”
document.getElementById（lightswitch）.src=buttonImg
}

以下是img：

<img src="lab11-1switchoff.jpg" alt="light switch" id="lightswitch" onMouseOver="turnSwitchOn()" onMouseOut="turnSwitchOff()" />

---

我网站上的图片不会变为我放在Javascript代码中的图片，这是为什么

您的Id需要加引号

function turnSwitchOn(img) {
    buttonImg="lab11-1switchon.jpg"
    document.getElementById("lightswitch").src=buttonImg
}
function turnSwitchOff(img) {
    buttonImg="lab11-1switchoff.jpg"
    document.getElementById("lightswitch").src=buttonImg
}

---

除了确保使用字符串（“lightswitch”）调用getElementById的修复程序外，如果将此传递到函数中，还可以做得更好，甚至不必按id查找图像：

<script>
function turnSwitchOn(img) {
    img.src="lab11-1switchon.jpg"
}
function turnSwitchOff(img) {
    img.src="lab11-1switchoff.jpg"
}
</script>

<img src="lab11-1switchoff.jpg" alt="light switch" id="lightswitch" onMouseOver="turnSwitchOn(this)" onMouseOut="turnSwitchOff(this)" />

功能接通（img）{
img.src=“lab11-1switch.jpg”
}
功能关闭（img）{
img.src=“lab11-1switchoff.jpg”
}

在使用getElementById函数时，如果要引用字符串“lightswitch”，则引用的是未定义的变量lightswitch。尝试将（lightswitch）设置为（“lightswitch”）。可能还有其他问题，但这是第一个解决方案。哇，谢谢！成功了。我们使用的那本书里面没有引号。听起来那本书很烂。使用在线资源，它们总是比文本书更新。这本书有点难理解。但这门HTML课程将在12月的第二周完成。