如何使用JavaScript测试和统计动态编号的类名

Question

我的目标是这样的：

var text = document.getElementsByClassName('decode-text')[0];

它是一个html元素的列表，如下所示：

<div class="decode-text">
    <div class="cycleText">
        <div class="cycle-0"> 
            <div class="text-animation">hey</div>
        </div>
        <div class="cycle-1"> 
            <div class="text-animation">you</div>
        </div>      
        <div class="cycle-2"> 
            <div class="text-animation">guys</div>
        </div>
    </div>
</div>

我将只使用indexof，但想了解为什么.contains返回false？

text.classList.contains('cycleText'); = false // why

还有关于在这个节点列表中获取'cycle-*'类名数量的建议吗？

Answer 1

您可以使用css属性选择器来实现这一点。^的意思是“开始”：

document.querySelectorAll('[class^="cycle-"]');

Answer 2

classList是分配给当前DOM元素的类的列表，不包括其子元素的类。

列表中唯一的条目是decode-text。