javascript - 循环遍历具有相同类的html元素并找到元素的顺序

Question

我创建了一个具有 3 个图像和 3 个点的图像滑块，每个点运行一个加载图像的函数，第一个点是第一个图像等。

现在我要问的是如何为 javascript 创建一个循环来执行相同的结果，而不是为每个按钮重复自己？

<span class="kcslider-dot" id="dot-1"></span> 
<span class="kcslider-dot" id="dot-2"></span> 
<span class="kcslider-dot" id="dot-3"></span> 

$("#dot-1").click(function(){
  currentSlide(1);
})

$("#dot-2").click(function(){
  currentSlide(2);
})

$("#dot-3").click(function(){
  currentSlide(3);
})

标签： javascriptjquery

Answer 1

另一种选择是使用jQuery Data

<span class="kcslider-dot" data-slide-id="1" id="dot-1"></span>
<span class="kcslider-dot" data-slide-id="2" id="dot-2"></span>
<span class="kcslider-dot" data-slide-id="3" id="dot-3"></span>

$(".kcslider-dot").click(function(){
  var slideId = $(this).data('slide-id');

  currentSlide(slideId);
});