javascript - 如何解决 Javascript map 循环不适用于每个 div 标签？

Question

有时我遇到这个问题，为什么 map 循环不工作，我仍然没有得到解决方案。

 let slide = document.querySelectorAll('.slide');

    //not working below
    slide.map((s)=>  s.onmousedown = slideFunction);

    function slideFunction(){
        alert('HI')
    }

    // working below
    let num = [3,2,5,2];
    num.map((n)=> alert(num));

map 循环不工作每张幻灯片，但数字值数组工作。

Answer 1

几个问题:

• 为此，您不应使用 map()，而应使用 forEach()。
• document.querySelectorAll() 函数返回 NodeList ，不是数组。您需要将其转换为数组才能对其调用 map() 等数组函数。
  但是，NodeList 确实提供了 forEach()函数，因此您可以直接在 document.querySelectorAll() 的结果上调用该函数。

let slides = document.querySelectorAll('.slide');

slides.forEach((s) => s.onmousedown = slideFunction);

function slideFunction() {
  alert('Hi')
}

<div class="slide">Slide one</div>
<div class="slide">Slide two</div>

附加事件处理程序而不是直接分配事件处理程序可能也更干净。