Question

我意识到这一切都在互联网上，但我实际上找不到一个我知道如何使用的东西。我是JS的新手，对HTML也很陌生。我发现最有用的是this，除了我不知道如何在代码中实现它。基于我发现的其他东西，我尝试了这个。

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <link rel="stylesheet" href="Styling/style.css">
    <script language="JavaScript">
        var image = document.getElementById("img1");
        var src = ["concert2.gif", "concert3.gif", "concert4.gif", "concert5.gif", "concert1.gif"];
    </script>
</head>

<body>
    <img id="img1" src="concert1.gif" alt="concert1.gif">
    <script language="JavaScript">
        var step = 0

        function slideit() {
            image.src = src[step];
            image.alt = src[step];
            if (step < 4) {
                step++;
                } else {
                    step = 1;
                    }
        }
        setInterval(slideit, 5000);
    </script>
</body>

它没有工作，只是留在concert1.gif。真的很感激一些帮助！

-Thanks

Answer 1

错误是您在第一个脚本标记中加载之前尝试检索图像元素。此外，不再需要language ='javascript'，因为JavaScript现在是唯一的脚本语言。

这是你的代码：

    <!DOCTYPE html>
    <html>
    <head>
        <title>Test</title>
        <link rel="stylesheet" href="Styling/style.css">
    </head>
    
    <body>
        <img id="img1" src="concert1.gif" alt="concert1.gif">
        <script>
            var image = document.getElementById("img1");
            var src = ["concert2.gif", "concert3.gif", "concert4.gif", "concert5.gif", "concert1.gif"];

            var step = 0
    
            function slideit() {
                image.src = src[step];
                image.alt = src[step];
                if (step < 4) {
                    step++;
                    } else {
                        step = 1;
                        }
            }
            setInterval(slideit, 5000);
        </script>
    </body>

它仍然没有显示任何内容，因为可能你的src不正确。但是，您仍然可以看到alt属性更改。 LoL;）

使用JavaScript旋转图像

1 个答案: