<div class="wrapper" id='wrapper'>
<p id='marqueeContent'>这是一段要滚动的文字</p>
</div>
function move () {
let wrapper = document.getElementById('wrapper')
let wrapperWidth = wrapper.getBoundingClientRect().width
let marqueeContent = document.getElementById('marqueeContent')
let marqueeContentWidth = marqueeContent.getBoundingClientRect().width
let distance = 20
setInterval(() => {
//当文字移动超出wrapper的左侧时 则归位
if (marqueeContent.getBoundingClientRect().x + marqueeContentWidth
< wrapper.getBoundingClientRect().x) {
distance = wrapperWidth
}
distance--
marqueeContent.style.transform = 'translateX(' + distance + 'px)'
}, 20)
}
move()