基于当前选定类的数据属性使用JavaScript隐藏div

给定一个数据属性为

数据集计数

的类

季节列表

，我有一个脚本，它将循环遍历所有

季节列表

类，并获取

数据集计数

值。但是，它当前只返回小于6的数据属性的值。如果

季节列表

类的

数据集计数

值超过6，我需要能够隐藏

js show more trigger

类。使用

trigger.style.display=“无”数据集计数

值小于6，则code>应隐藏触发器类，但我得到错误

无法设置未定义的属性“display”

let trigger=document.getElementsByClassName（'js-show-more-trigger'）；
让季节列表=document.getElementsByClassName（“季节列表”）
for（设i=0；i

。季节列表{
显示器：flex；
}

第一集

21分钟
第二集

21分钟
第三集

21分钟
显示
更多

您正在将

显示

属性设置为数组

触发器

而不是它包含的元素，这就是为什么它说

无法设置未定义的属性“显示”

您需要替换

trigger.style.display=“无”带有
触发器[i]。style.display=“无”
分别以每个触发器为目标。
const trigger=document.querySelector（“.js显示更多触发器”）；
const trigger = document.querySelector('.js-show-more-trigger');
const seasonLists = document.querySelectorAll('.season-list');
seasonLists.forEach(seasonList => {
  if (Number(seasonList.getAttribute('data-episode-count') < 6)) trigger.style.display = "none";
});

const seasurelists=document.querySelectorAll（“.seasurelist”）；
季节列表。forEach（季节列表=>{
if（Number（statist.getAttribute（'data-eption-count'）<6））trigger.style.display=“无”；
});

您最初的
触发器
是一个HTMLCollection，而不是元素-在选择单个元素时使用querySelector，在需要迭代时通常使用NodeList（qSA）。getElementsBy*方法返回HTMLCollections，这可能很难使用。考虑使用QueRealStReTrORL，它返回静态NODLIST——不像HTMLCype，它可以直接迭代，在迭代时不会改变，它更灵活。
在HTML中只有一个<代码>。当任何
.seasure list
s的计数少于6时，或者当each的计数少于6时，或者什么时候，是否要隐藏
触发器？我猜你的代码笔没有显示整个HTML。@一定的性能-实际的页面可以有一到多个
季节列表
类。只有当
js季节列表项
类的display设置为block且数据集计数小于6时，它才应该隐藏触发器。令人困惑的是，每个
季节列表
都有自己的
数据集计数
。当有两个
季节列表时会发生什么？一个是9，另一个是3？因此，基本上，当用户选择季节时会触发此脚本。它检查当前可见的
季节列表
div是否设置为显示块。如果该div的
数据集计数小于等于6，则应隐藏触发器。否则，它应该是可见的。我认为最好的方法是检查哪个
季节列表
具有显示块样式。如果是，请检查
数据集计数
属性的值是否小于6。如果是，则将触发器设置为“无”。我试图弄清楚如何首先检查
季节列表
类的显示状态，然后使用data属性根据其值显示或隐藏。希望这能解决这个问题。此错误与
无法读取未定义的属性“style”