向Javascript前后滑块添加页面导航

所以我有这个滑块，它有后退和前进功能，我的目标是为每个幻灯片分别添加按钮

我曾尝试使用类似的

document.querySelectorALL（'.dots'）

来提取所有

.dots

，但我无法将它们分配给幻灯片。任何帮助都将不胜感激

拉动每个幻灯片上加载的箭头按钮的代码：

Array.from（document.queryselectoral（'.next'））.forEach（（ctrl）=>ctrl.addEventListener（'click'，（ev）=>this.navigate（ev，'next'））

Array.from（document.queryselectoral（'.prev'））.forEach（（ctrl）=>ctrl.addEventListener（'click'，（ev）=>this.navigate（ev，'prev'））

导航功能：

navigate(ev, direction) {
            if ( this.isAnimating ) {
                return false;
            }
            this.isAnimating = true;
            const currentGrid = this.grids[this.current];

            this.current = direction === 'next' ? (this.current < this.gridsTotal-1 ? this.current+1 : 0) : (this.current > 0 ? this.current-1 : this.gridsTotal-1);
            const nextGrid = this.grids[this.current];
            const filled = this.CONFIG.filledColor;
            currentGrid.hide(!!filled).then(() => {
                nextGrid.show(!!filled).then(() => this.isAnimating = false);
                if ( this.CONFIG.hasTilt ) {
                    this.onmousemove(ev);
                }
            });
        }

导航（电动汽车，方向）{
如果（这个是动画）{
返回false；
}
this.isAnimating=true；
const currentGrid=this.grids[this.current]；
this.current=direction=='next'？（this.current0？this.current-1：this.gridsTotal-1）；
const nextGrid=this.grids[this.current]；
const filled=this.CONFIG.filledColor；
currentGrid.hide（！！填充）。然后（（）=>{
nextGrid.show（！！filled）。然后（（）=>this.isAnimating=false）；
如果（this.CONFIG.lt）{
这是一种移动（ev）；
}
});
}

用于点导航的HTML代码段

<ul class="slidernav test">
  <li class="pulse" id="section-1"><use xlink:href="#circle"></use></li>
  <li class="pulse" id="section-2"><use xlink:href="#circle"></use></li>
  <li class="pulse" id="section-3"><use xlink:href="#circle"></use></li>
</ul>```







```
添加您的代码片段html css和javascripti我已经使用了这个滑块，在更新了html dots导航的代码中也找到了这个滑块。如果您使用的是第三方库，请查看文档。dots可能是设置滑块初始化的一个选项。不幸的是，没有第三方库与内置函数一起使用。我已经使用教程在我的网站上集成了滑块，但是我想添加额外的点按钮，每个点按钮都指定给滑块