这应该是非常简单的,但我真的很难把它放在一起。
简单地说,我在我的网站上有一个侧边栏,有A - Z类别的YouTube系列列表。Here's what it looks like.如果需要,你也可以查看整个here。它现在工作正常,看起来不错,但我想在每个下拉列表中有一个动态计数器的系列数量。所以例如,如果有15个系列在“B”类别中,B旁边会有一个小小的15
我可以只使用HTML来制作静态计数器,但是当你从下拉菜单中过滤掉一些元素时,问题就出现了。
下面是侧边栏的HTML摘录。
<li>
<label>
A
<input type="checkbox">
</label>
<ul>
</ul>
</li>
<li>
<label>
B
<input type="checkbox">
</label>
<ul class="series-list">
<ol>series...</ol>
<ol>series...</ol>
<ol>series...</ol>
<ol>series...</ol>
<ol>series...</ol>
</ul>
</li>
我的想法是创建一个脚本,它会自动接收带有class =“series-list”的ul(将其与其他不相关的ul分开),然后计算其中ol元素的数量。然后通过innerHTML将该数量插入到标签中的字母旁边。
到目前为止,我已经写了很多脚本,但它们什么都不做,这可能是我写过的最不糟糕的一个,尽管它仍然很糟糕。
let dropdowns = document.querySelectorAll('series-list');
var count;
for (let i = 0; i < length.dropdowns; i++) {
count = dropdowns[i];
console.log(count);
}
我应该注意到这个脚本显然没有做任何改变,因为它只是控制台记录计数。我只是在测试它在这一点上-我甚至没有接近实际实现它。
在我的辩护中,我最近睡得不多,醒着的大部分时间都花在编码上,所以我的大脑被烧焦了。
任何帮助都很感激。
2条答案
按热度按时间cngwdvgl1#
我放回你的确切的html。和修改脚本
piztneat2#
试试这样的方法: