js 实现自动打字的效果

用JS来实现一个动态打字的效果

效果:

 

 

 

html:

<div id="text"></div>

js:

let divTyping = document.getElementById('text')
let i = 0,
timer = 0,
str = 'www.baidu.com'

function typing() {
if(i <= str.length) {
divTyping.innerHTML = str.slice(0, i++) + '|'
timer = setTimeout(typing, 300)
} else {
divTyping.innerHTML = str //结束打字,移除 _ 光标
clearTimeout(timer)
}
}

typing()

posted @ 2020-05-27 11:57  老和尚106  阅读(189)  评论(0编辑  收藏  举报