【发布时间】：2020-12-14 10:07:57
【问题描述】：
我想用reddit之类的孩子隐藏cmets，我写了这个函数：
function toggle(id, lft, rgt) {
var kids = (rgt - lft - 1) / 2;
if (kids >= 1) {
var element = document.querySelector("div.com#com" + id).getAttribute('value');
var low = Number(element.split('-')[0]);
var high = Number(element.split('-')[1]);
for (var i = low + 1; i <= high - 1; i += 1) {
const x = document.querySelectorAll('div.com[min=' + i + ']');
}
Array.from(x).forEach(comment => {
if (comment.style.display === "none") {
comment.style.display = "block";
} else {
comment.style.display = "none";
}
});
}
例如这是父评论：
<div>
<a onclick="return toggle(1, 1, 4)" href="javascript:void(0)">[-]</a>
<div id="com1" class="com md" value="1-4" min="1">yellow</div>
</div>
这是一个子评论：
<div>
<a onclick="return toggle(2, 2, 3)" href="javascript:void(0)">[-]</a>
<div id="com2" class="com md" value="2-3" min="2">hello </div>
</div>
我想隐藏所有在父值 1 和 4 之间具有 min 属性的 cmets，并且该子级具有 min=2，因此必须将其隐藏。但是js函数不工作，那是什么问题呢？
其他问题？
- 我应该在
for loop中写foreach还是可以 这样吗？ - 如果标题中的错误得到修复，该功能是否可以工作并且子cmets会被隐藏，如果没有，为什么？
【问题讨论】：
-
当您拥有应该是唯一的 ID 时，为什么要使用类选择器？只需使用
document.getElementById("com"+id).getAttribute("value")- 但是不建议在非表单字段上使用 value 属性 -
另外请点击edit 然后
[<>]sn-p 编辑器并生成minimal reproducible example -
@mplungjan 谢谢，但问题出在
const x = document.querySelectorAll('div.com[min=' + i + ']'); -
不，不要。 @mplungjan 'div.com[min=' + i + ']` 和
div.com[min="${i}"]的区别在于第一个会生成'div.com[min=0]'，这是无效的，而第二个会生成'div.com[min="0"]'，这是有效的吗？此外，这个问题是一个很好的标志，人们很可能会带着同样的 DOMException 错误消息来到这里（减去实际的'div.com[min=]'过去） -
for 循环也没有任何意义.....您只是在集合中的最后一项上执行 Array.from()。
标签： javascript