在第一张卡片[0]下得到一条红色波浪线，我不知道是什么原因造成的[重复]答案

【问题标题】：Getting a red squiglly line under the first cards[0], I dont know what is causing it [duplicate]在第一张卡片[0]下得到一条红色波浪线，我不知道是什么原因造成的[重复]
【发布时间】：2021-12-30 09:49:05
【问题描述】：

这是最小的 js，其他的都被注释掉了。我无法理解为什么“cards[i]”（for 循环中的第一个）下面有一条红色波浪线，我无法运行任何控制台命令。请帮忙！

    let cards=document.querySelectorAll(".blocks");
    let pic,card,rand;
    let finals = [];
    const count = 10; 
    const max = 9;
    
    for(let k = 0; k < 1000; k++){
      rand = Math.round(Math.random() * max);
    //   !finals.includes(rand) && finals.push(rand)
      if(!finals.includes(rand))
      finals.push(rand);
    }
    finals = finals.slice(0, count)
    setupCards(finals);
    
    function setupCards(arr){
        
        for(let i=0;i<=arr.length;i++){
    ====>cards[i].style.backgroundImage=`url(images/${arr[i]}.jpg)`;
        // cards[i].style.transform="rotateY(180deg)";
        // cards[i].style.backgroundImage="url(images/back6.jpg)";             
     }
}

【问题讨论】：

i<=arr.length 表示一个错误；见What is an off-by-one error and how do I fix it?。另一件事：您的<script> above 您的 HTML 是否没有 defer 属性且没有 DOMContentLoaded 或 load 侦听器并且不是 type="module"？见Why does jQuery or a DOM method such as getElementById not find the element?。
请分享对应的HTML、CSS代码。

标签： javascript css

【解决方案1】：

在这种情况下测试：

for(let i=0;i<=arr.length;i++){

你让 i 从零（这是第一个元素的索引）到数组的长度（这让你到达最后一个加 1 元素 - 它不存在）。

试试：

  for(let i=0;i<arr.length;i++){

【讨论】：

嘿，感谢您的解决方案，就是这样。现已修复。