无法使用 getElementById() 获取应用 "display: none" 属性的元素

Question

我遇到了一个问题，即getElementById()函数无法在应用了display: none属性的页面上获取特定元素，即使它在DOM中可见(我可以看到div及其id存在于最终呈现的页面上(。

有办法绕过这个吗？

这是代码：

togglePanel() {
const panelId = this.accordionItem.querySelector("#collapsible-panel");
this.shouldShowAccordion = !this.shouldShowAccordion;
if (this.shouldShowAccordion) {
panelId.classList.remove("collapsed");
}
else {
panelId.classList.add("collapsed");
}  
}

"可折叠面板"；是应用了display: none的div的ID。

Answer 1

setTimeout(() => {
document.querySelector("div[id='collapsiblepanel']").style.display = 'block';
}, 2000)

#collapsiblepanel {
width: 200px;
height: 100px;
background-color: red;
display: none;
}
Following is ana example where I am selecting a div which has the value of display as none. After 2 seconds I am setting up it's display to block.

<div id="collapsiblepanel">
</div>