JavaScript 实现打字效果

2022/6/22 1:21:13

本文主要是介绍JavaScript 实现打字效果,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!


function typing(that)
{
    that = typeof(that.length) == 'undefined' ? [that] : that;

    for(var i = 0; i < that.length; i ++)
    {
        let text = that[i];
        let str = text.innerHTML;
        let index = 0;
        text.innerHTML = '';

        let timer = setInterval(function()
        {
            var current = str.substr(index, 1);
            if(current == '<')
            {
                index = str.indexOf('>', index) + 1;
            }
            else
            {
                index ++ ;
            }

            text.innerHTML = str.substring(0, index) + (index & 1 ? '_': '');

            if(index >= str.length)
            {
                text.innerHTML = str.substring(0, index);
                clearInterval(timer);
            }
        }, 40);
    }
}

typing(document.getElementsByClassName('words1'));
typing(document.getElementById('words2'));

 



这篇关于JavaScript 实现打字效果的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程