JavaScript -使用switch语句创建一个每隔3秒更改一次的广告

JavaScript - Create an ad that changes every 3s using a switch statement

本文关键字：3秒 一次 一个 switch 使用 语句 创建 JavaScript      更新时间：2023-09-26

我需要创建一个广告，每隔3秒自动更改图片。这是我到目前为止所做的，但我被困在哪里去和如何完成:1. 声明一个名为currentImage的变量，其值为1。2. 声明一个名为autoAdvance的变量，并将其设置为每3秒运行一次ChangeAd()函数。3.创建一个名为ChangeAd()的函数。4.在函数中，使用case结构来确定要显示的下一个广告。-在switch语句中使用currentImage变量。-对于情况1:设置第一个img元素的源为"concert2.gif"，然后将currentImage变量设置为2。-对于情况2:设置第一个img元素的源为"concert3.gif"，然后将currentImage变量设置为3。-对于情况3:设置第一个img元素的源为"concert4.gif"，然后将currentImage变量设置为4。-对于案例4:设置第一个img元素的源为"concert5.gif"，然后将currentImage变量设置为5。-对于案例5:设置第一个img元素的源为"concert1.gif"，然后将currentImage变量设置为1。记住在需要的地方包括break语句。

[编辑]

 <p><img src="concert1.gif" id="img" height="60" width="370" alt="Changing advertising image" /></p>
 <script>
  "use strict";
  var currentImage = 1;
  var autoAdvance = setInterval(ChangeAd, 3000);
  function ChangeAd(currentImage) {
  var image = document.getElementsByTagName("img");
     switch(currentImage){
        case 1:
           currentImage = 2;
           return "concert2.gif";
           break;
        case 2:
           curentImage = 3;
           return "concert3.gif";
           break;
        case 3:
           currentImage = 4;
           return "concert4.gif";
           break;
        case 4:
           currentImage = 5;
           return "concert5.gif";
           break;
        case 5:
           currentImage = 1;
           return "concert1.gif";
           break;
     }
  } 
 </script>

应该可以。我创建了一个包含所有图像路径的数组，它只是在它们上面循环。你可能应该用getElementsByTagName以外的东西或者用getElementById来代替

var images = ["concert2.gif", "concert3.gif", "concert4.gif", "concert5.gif", "concert1.gif"];
var image = document.getElementsByTagName("img");
var currentImage = 0;
var autoAdvance = setInterval(ChangeAd, 3000);
function ChangeAd() {
    image.src= images[currentImage];
    currentImage ++;
    if(currentImage == images.length) currentImage = 0;
}
相关文章：