Javascript 为什么我的函数不能正确识别元素的样式？

我有三个div。加载页面时，只有第一个div可见。单击按钮后，第二个div可见。再次单击后，第三个div也应该可见，但它不可见，我不明白为什么

我通过一个js“if语句”来更改div的显示，该语句检查div是否已经可见

我做错什么了吗

函数displayMore（）{
if（document.getElementById（“div_02”）.style.display==“无”）{
document.getElementById（“div_02”）.style.display=“block”；
}else if（document.getElementById（“div_03”）.style.display==“无”）{
document.getElementById（“div_03”）.style.display=“block”；
}
}

#div_01{
宽度：100%；
高度：50px；
背景：紫色；
}
#分区02{
显示：无；
宽度：100%；
高度：50px；
背景：紫罗兰色；
}
#第03课{
显示：无；
宽度：100%；
高度：50px；
背景：粉红色；
}

---

这是一个使用计数器变量的解决方案。计数器代表当前div，当您添加新div时，请增加计数器。 您可以使用

nextElementSibling

设置下一个元素的样式

let计数器=0；
函数displayMore（）{
让currentDiv=document.getElementsByTagName（“div”）[计数器]；
console.log（currentDiv.nextElementSibling.style.display）
currentDiv.nextElementSibling.style.display=“block”；
计数器++；
}

#div_01{
宽度：100%；
高度：50px；
背景：紫色；
}
#分区02{
显示：无；
宽度：100%；
高度：50px；
背景：紫罗兰色；
}
#第03课{
显示：无；
宽度：100%；
高度：50px；
背景：粉红色；
}

必须在

if

中使用

==

非

=

错误

if（document.getElementById（“div_02”）.style.display=“none”）{

正确：

if（document.getElementById（“div_02”）.style.display==“none”）{

@MTK我刚刚根据你的回答更改了我的代码。它仍然不起作用…我投票赞成重新打开，因为OP用提示更新了他的问题，这是复制的原因，但仍然不起作用。他没有进入条件，因为

document.getElementById（“div_02”）.style.display

为空，这可以通过在条件之前记录其值来看出。在原始问题中，您没有选中==您只是将其值设置为=这就是他显示第一个的原因。