Javascript 为什么我在变量中添加1，但每次都添加“2”？

在下面的代码中，我想将1添加到页面变量中，但每次单击“下一步”按钮时，它都会将2添加到变量中

var slides=document.querySelectorAll.slides'； var dots=document.queryselectoral.dot'； var-page=0； 函数Swiperpage{ 如果页面>幻灯片。页面长度=0； 如果页面<0，则页面=幻灯片长度； 对于let i=0；ih1，身体>h2，身体>h3，身体>h4，身体>h5，身体>h6，身体>p{ 左侧填充：16px； .btnload:悬停{ 背景色：4169E1； } */ .flexbox{ 显示器：flex； 柔性包装：包装； } 上校25{ 弹性：25%； } 上校50{ 弹性：50%； } 上校75{ 弹性：75%； } 上校100{ 弹性：100%； } 按钮 输入{ 大纲：无； } .集装箱{ 最大宽度：1000px； 位置：相对位置； 左边距：自动； 右边距：自动； } .幻灯片{ 宽度：100%； 身高：100%； 位置：绝对位置； 显示：无； 动画：幻灯片0.4s轻松； } @关键帧滑动{ 0% { 不透明度：0.2 } 100% { 不透明度：1 } } .主动{ 显示：块； } .幻灯片.页码{ 位置：绝对位置； 排名：0； 左：0； 填充：12px 8px； 颜色：白色； } .幻灯片{ 颜色：白色； 位置：绝对位置； 顶部：310px； 左：50%； } img{ 宽度：100%； 高度：自动； } .货柜a{ 填充：16px； 颜色：白色； 文字装饰：无； 过渡：0.4s； 字体大小：20px； 顶部：150px； 位置：绝对位置； } img{ 宽度：100%； 高度：自动； } .容器a：悬停{ 背景色：rgba0,0,0,0.616； } .右滑梯{ 右：0px； } .集装箱左滑梯{ 左：0px； } .分页{ 显示器：flex； 最大宽度：1000px； 高度：100px； 位置：相对位置； 顶部：380px； 证明内容：中心； 左边距：自动； 右边距：自动； } .pagination.dot{ 边界半径：50%； 高度：15px； 宽度：15px； 光标：指针； 保证金：2倍； 过渡：0.6s； } .分页.点：悬停{ 背景色：rgb138、138、138； } 多特先生{ 背景色：ddd； } .活性点{ 背景色：rgb138、138、138； } .没有活动{ 背景色：ddd； } 1/4 标题一 2/4 标题二 3/4 标题三 4/4 标题四 首先，向页面添加滑块以更新页面的值，并将结果传递给Swiper

然后将滑块添加到页面的新值，再次更新页面的值，并将结果传递到console.log

根据经验，将修改变量的操作与将变量传递给函数的操作相结合是一种很好的混淆方法

为了清晰起见，您可能需要拆分这些操作

page += slider;
Swiper(page);
console.log(page);

---

我想是因为这行console.logpage+=滑块 它使页面增加了2倍

function Slider(slider) {
    console.log(page)
    console.log(slider)
    Swiper(page += slider);
    console.log(page += slider) // <<<--------------- This line
}

---

您将添加它两次—一次在Swiperpage+=滑块中，一次在console.logpage+=滑块中。

function Slider(slider) {
    console.log(page)
    console.log(slider)
    Swiper(page += slider);
    console.log(page += slider) // <<<--------------- This line
}