JS实现动态打字效果,效果保证是你想要的,直接上代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head> <body>
<div id="text"> </div>
</body>
<script>
let divTyping = document.getElementById('text')
let i = 0,
timer = 0,
str = '用JS实现动态打字效果'
function typing () {
if (i <= str.length) {
divTyping.innerHTML = str.slice(0, i++) + '_'
timer = setTimeout('typing()', 200)
}
else {
divTyping.innerHTML = str//结束打字,移除 _ 光标
clearTimeout(timer)
}
}
typing()
</script>
</html>
把以上代码,存为html文件,打开就可以看到JS实现动态打字效果了。
如果不想让别人看到你是如何实现的,可以把js代码加密,js代码加密,就用JShaman(http://www.jshaman.com/)。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head> <body>
<div id="text"> </div>
</body>
<script>
let divTyping = document.getElementById('text')
let i = 0,
timer = 0,
str = '用JS实现动态打字效果'
function typing () {
if (i <= str.length) {
divTyping.innerHTML = str.slice(0, i++) + '_'
timer = setTimeout('typing()', 200)
}
else {
divTyping.innerHTML = str//结束打字,移除 _ 光标
clearTimeout(timer)
}
}
typing()
</script>
</html>
把以上代码,存为html文件,打开就可以看到JS实现动态打字效果了。
如果不想让别人看到你是如何实现的,可以把js代码加密,js代码加密,就用JShaman(http://www.jshaman.com/)。