如何使用 JavaScript 选择 Bootstrap 分页代码中的所有元素？

Question

我正在为我准备的网站使用Bootstrap。由于溢出滚动条看起来很糟糕，我用CSS隐藏了它，并尝试通过JavaScript用鼠标滚轮滚动分页。当我使用下面给出的代码时，顶部的代码可以工作，但底部的代码却不能。当我在JavaScript代码中给出[0,1]作为索引值时，这一次底部的索引值起作用，但顶部的索引值不起作用。如何使其在同一页面的两个分页上工作？据我从研究中了解到，我可能需要使用let或va

P粉676821490 · Answer

您可以使用 querySelectorAll 获取该类的所有元素，然后循环遍历它们以向每个元素添加一个事件侦听器。

const containers = document.querySelectorAll(".table-responsive");
containers.forEach(container => {
  container.addEventListener("wheel", function (e) {
    if (e.deltaY > 0) {
      container.scrollLeft += 100;
      e.preventDefault();
    } else {
      container.scrollLeft -= 100;
      e.preventDefault();
    }
  });
});