js歌词效果问题--读取innerHTML最大长度有误？求解析

最新推荐文章于 2021-06-10 03:27:57 发布

原创最新推荐文章于 2021-06-10 03:27:57 发布 · 354 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jsvascript

本文探讨了一段JavaScript代码实现的文本逐字高亮显示与滚动效果，解决了括号处样式无法正确应用的问题，通过调整代码逻辑实现了预期的动态显示效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

先给各位大大贴张效果图(功能已解决)
在这里插入图片描述
原来呢就是到了前括号 ‘(’ ,开始，就加不上样式了，我将括号添加到前面文字中，可以正常设置，得到结论，js中文字长度不够，可是文字是设置的.length啊，怎会不够？贴上js代码如下。

        function aaa() {
            var oP = document.getElementById('p_info');
            // var str1 = oP.innerHTML;
            var str = oP.innerText;
            console.log(str)
            var a = 0;
            function color() {
                for (var i = 0; i < str.length; i++) {
                    var str1 = '<span>' + str[i] + '</span>'
                    $(str1).appendTo("#p2_info")
                }
                $('#p_info').empty()
            }
            function play() {
                var len = str.length;
                // console.log(len)
                var $spans = $('span');
                $($spans[a]).addClass('red size_info').siblings().removeClass('red size_info')
                a++;

                var timer = null
                timer = setTimeout(play, 200);
                if (a >= len+4) {
                    clearTimeout(timer);
                    a = 0;
                    play();
                }
            }
            color();
            play();
        }
        aaa();

如上代码所示： if (a >= len+4) {
clearTimeout(timer);
a = 0;
play();
}
此部分a>=len+4,是修改过后，正常的效果，个人认为，+4似乎没必要？长度怎会不够？求大牛告知，万分感激不尽…