如何隐藏子元素而不是使用普通 Javascript 删除?
How to hide child elements instead of deleting using plain Javascript?
这是示例 Javascript:
qwertyID.addEventListener('click', (e)=>{
let button=e.target;
button.classList.add("chosen");
button.disabled="true";
let letterFound=checkLetter(button);
ol=document.getElementsByTagName('OL')[0];
if (letterFound==null) {
ol.lastChild.style.display="none";
missed+=1;
}
checkWin();
});
我不想从父元素中删除子元素,而是希望每次都隐藏它们。 remove 方法一个接一个地删除子元素。但是,显示 属性 时,即使再次满足条件,它也只会删除单个元素,然后再删除 none 。
当 letterFound 等于 null 时,如何隐藏其余的子元素?它适用于 remove 方法,但不适用于隐藏的显示。但是我不想一定要删除子元素。
就像 Barmar 所说的,你总是隐藏最后一个元素,但你实际上不需要遍历你的元素来找到最后一个隐藏的元素,因为你已经在跟踪玩家错过的次数.
if (letterFound==null) {
ol.childNodes[childNodes.length - 1 - missed].style = "none";
missed += 1;
}
ol.lastChild
是 ol
的最后一个 child,即使它已经被隐藏。所以你只是每次隐藏相同的元素。
您需要找到最后一个仍然可见的 child 并将其隐藏。您可以通过从 childNodes
列表的末尾开始循环来做到这一点。
for (let i = ol.childNodes.length - 1; i >= 0; i--) {
if (ol.childNodes[i].style.display != "none") {
ol.childNodes[i].style.display = "none";
break;
}
}
这是示例 Javascript:
qwertyID.addEventListener('click', (e)=>{
let button=e.target;
button.classList.add("chosen");
button.disabled="true";
let letterFound=checkLetter(button);
ol=document.getElementsByTagName('OL')[0];
if (letterFound==null) {
ol.lastChild.style.display="none";
missed+=1;
}
checkWin();
});
我不想从父元素中删除子元素,而是希望每次都隐藏它们。 remove 方法一个接一个地删除子元素。但是,显示 属性 时,即使再次满足条件,它也只会删除单个元素,然后再删除 none 。
当 letterFound 等于 null 时,如何隐藏其余的子元素?它适用于 remove 方法,但不适用于隐藏的显示。但是我不想一定要删除子元素。
就像 Barmar 所说的,你总是隐藏最后一个元素,但你实际上不需要遍历你的元素来找到最后一个隐藏的元素,因为你已经在跟踪玩家错过的次数.
if (letterFound==null) {
ol.childNodes[childNodes.length - 1 - missed].style = "none";
missed += 1;
}
ol.lastChild
是 ol
的最后一个 child,即使它已经被隐藏。所以你只是每次隐藏相同的元素。
您需要找到最后一个仍然可见的 child 并将其隐藏。您可以通过从 childNodes
列表的末尾开始循环来做到这一点。
for (let i = ol.childNodes.length - 1; i >= 0; i--) {
if (ol.childNodes[i].style.display != "none") {
ol.childNodes[i].style.display = "none";
break;
}
}