时间戳

首页 > 解决方案 > 我如何将所有这些代码存储在变量中

javascript - 我如何将所有这些代码存储在变量中

问题描述

我怎样才能将所有这些代码保存在一个变量中？我想在另一个地方调用这个代码。我想在这个幻灯片菜单上添加一个点击事件。如果我在另一个点击事件函数中编写所有这些代码，这很容易。但我不想那样做，我想通过使用变量在点击事件中调用所有这些代码

function change() {
  if (document.getElementsByClassName("sliderItems")[0].classList.contains("active")) {
    document.getElementsByClassName("sliderItems")[1].classList.add("active");
    document.getElementsByClassName("sliderItems")[0].classList.remove("active");
  } else if (document.getElementsByClassName("sliderItems")[1].classList.contains("active")) {
    document.getElementsByClassName("sliderItems")[2].classList.add("active");
    document.getElementsByClassName("sliderItems")[1].classList.remove("active");

  } else if (document.getElementsByClassName("sliderItems")[2].classList.contains("active")) {
    document.getElementsByClassName("sliderItems")[3].classList.add("active");
    document.getElementsByClassName("sliderItems")[2].classList.remove("active");

  } else if (document.getElementsByClassName("sliderItems")[3].classList.contains("active")) {
    document.getElementsByClassName("sliderItems")[4].classList.add("active");
    document.getElementsByClassName("sliderItems")[3].classList.remove("active");

  } else if (document.getElementsByClassName("sliderItems")[4].classList.contains("active")) {
    document.getElementsByClassName("sliderItems")[1].classList.add("active");
    document.getElementsByClassName("sliderItems")[4].classList.remove("active");
  }
}
setInterval(change, 2000);

标签： javascript

解决方案

我不确定你的代码是什么意思，我认为你的意思是滑块项数组，如果这是你的意思很容易。

var sliderItems = document.getElementsByClassName('sliderItems');

sliderItems[0].classList.add('active');

使用变量存储 DOM 元素的最大优势是比每次使用它都搜索元素时性能更好。

推荐阅读