将“name”属性更改为“id”，但图像不显示

Question

错误：img 元素的名称属性已过时。请改用 id 属性。

<img src name="slide" width="1714" height="500" alt="slideshow" />

在上面你可以看到我有这个错误，要求我将“名称”更改为“id”，但是当我尝试这个时，它最终导致我的图像不出现。所以本质上'id'不起作用，但'name'起作用。有什么想法吗？

https://gyazo.com/ff5c6b39d5a1b649027d2fca57a1ffa1

正如您在第一张图片中看到的那样，代码在运行时正在运行 <img src name=""/>

    <script>
    var i = 0; // Start Point
    var images = []; // Images Array
    var time = 3000; // Time Between Switch`

    // Image List
    // This holds an array of all my images
    images[0] = "images/img_house.png";
    images[1] = "images/img_staff.jpg";
    images[2] = "images/img_desk.jpg";
    images[3] = "images/img_coinstack.jpg";

    // Change Image
    function changeImg() {
      document.slide.src = images[i];

      // Check If Index Is Under Max
      if (i < images.length - 1) {
        // Add 1 to Index
        i++;
      } else {
        // Reset Back To O
        i = 0;
      }

      // Run function every x seconds
      setTimeout("changeImg()", time);
    }

    // Run function when page loads
    window.onload = changeImg;

  </script>
  <section>
    <img src name="slide" width="1714" height="500" alt="slideshow" />
  </section>`

下面我已将代码更改为<img src id=""/>，它不再起作用，它显示了替代文本。

https://gyazo.com/634a5fa6db7e1acf22a55815f19d6da2

Answer 1

在您的函数中，您使用name 属性“slide”插入它。但是id 不是name，必须从文档中获取。所以

document.getElementById("slide").src = images[i];

另外，<img> 标签不使用或不需要结束斜线。