代码：

const Swiper = el => {

const container = document.querySelector(el)

const wrapper = container.querySelector('.swiper-wrapper')

const sliders = wrapper.querySelectorAll('.swiper-slider')

const ctrl = document.querySelector('.ctrl')

const prev = ctrl.querySelector('.prev')

const next = ctrl.querySelector('.next')

const containerWidth = container.getBoundingClientRect().width

const slideLength = sliders.length

const colors = ['#fff7b1', '#ffcab9', '#d7ffd9', '#c8e7ff']

for(let i = 0; i < slideLength; i++){

sliders[i].style.width = containerWidth + 'px'

sliders[i].style.background = colors[i]

}

let current = 0

let timer = null, timeout = null

const autoplay = () => {

timer = setInterval(() => {

if (current === 3) {

current = 0

} else {

current += 1

}

wrapper.style.left = -current * containerWidth + 'px'

}, 3000)

}

autoplay()

prev.addEventListener('click', () => {

clearInterval(timer)

clearTimeout(timeout)

if (current === 0) {

current = slideLength - 1

} else {

current -= 1

}

wrapper.style.left = -current * containerWidth + 'px'

timeout = setTimeout(autoplay, 1000)

})

next.addEventListener('click', () => {

clearInterval(timer)

clearTimeout(timeout)

if (current === slideLength - 1) {

current = 0

} else {

current += 1

}

wrapper.style.left = -current * containerWidth + 'px'

timeout = setTimeout(autoplay, 1000)

})

}

Swiper('.swiper-container')