Question

以下是示例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方法一个接一个地删除子元素。但是，使用display属性时，即使再次满足条件，它也只删除单个元素，此后不删除任何元素。

当letterFound等于null时，如何隐藏其余的子元素？它与remove方法一起使用，但不隐藏显示。但是我不想删除子元素。

Answer 1

ol.lastChild是ol的最后一个子代，即使它已被隐藏。因此，您每次都只是隐藏相同的元素。

您需要找到最后一个仍然可见的孩子并将其隐藏。您可以从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;
    }
}

Answer 2

就像Barmar所说的那样，您总是隐藏最后一个元素，但实际上并不需要遍历元素来找到最后一个隐藏元素，因为您已经在跟踪玩家错过的次数。 / p>

if (letterFound==null) {
    ol.childNodes[childNodes.length - 1 - missed].style = "none";
    missed += 1;
}

如何隐藏子元素而不是使用纯Javascript删除子元素？

2 个答案: