特效一 - - js实现文字一个一个显示

在线小白www

已于 2022-08-03 16:41:26 修改

阅读量1.6k

点赞数 2

分类专栏： JavaScript 文章标签： javascript 前端 servlet

于 2022-08-02 11:13:30 首次发布

本文链接：https://blog.csdn.net/qq_43654065/article/details/126118592

版权

JavaScript 专栏收录该内容

128 篇文章 7 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <div></div>
</body>
<script>
  let divEL = document.getElementsByTagName('div')[0]
  let text = 'we need love!'
  let index = 1
  let timer = null

  function showText() {
    divEL.innerText = text.slice(0, index)
    index++
    if (index >= text.length) {
      clearTimeout(timer)
    }
    timer = setTimeout(() => showText(), 500)
  }
  showText()
</script>

</html>