JavaScript を使用してブートストラップのページネーション コード内のすべての要素を選択するにはどうすればよいですか?

Question

私は準備中の Web サイトに Bootstrap を使用しています。オーバーフロースクロールバーが見栄えが悪かったのでCSSで隠し、JavaScript経由でマウスホイールでページネーションをスクロールしてみました。

以下のコードを使用すると、上のコードは機能しますが、下のコードは機能しません。 JavaScript コードでインデックス値として [0,1] を指定すると、今度は下のインデックス値は機能しますが、上のインデックス値は機能しません。同じページ上の 2 つのページネーションで機能させるにはどうすればよいですか?調査からわかったことによると、const の代わりに let または var 変数を使用する必要があるかもしれません。

リーリー リーリー リーリー

Answer 1

querySelectorAll を使用してそのクラスのすべての要素を取得し、それらをループして各要素にイベント リスナーを追加できます。

const コンテナ = document.querySelectorAll(".table-sensitive");
コンテナー.forEach(コンテナー => {
  Container.addEventListener("ホイール", function (e) {
    if (e.deltaY > 0) {
      コンテナ.scrollLeft = 100;
      e.preventDefault();
    } それ以外 {
      コンテナ.scrollLeft -= 100;
      e.preventDefault();
    }
  });
});