小案例：用javascript实现页面打字效果显示

   js关键函数：slice()

<!DOCTYPE html>
<html lang="en">
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    <body>
        <div id="box"></div>
        <script>
            var str = "超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。您可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。";
            var i = 0;
            setInterval(function(){
                i++;
                document.getElementById("box").innerHTML = str.slice(0, i) + " |";
                if(i > str.length)
                    i = 0;
            }, 100);
        </script>
    </body>
</html>

   效果如下：

posted @ 2020-12-17 00:13  孤舟残月浅笑嫣然  阅读(169)  评论(0)  编辑  收藏  举报