我正在尝试进行切换，以将元素的显示更改为“无”（如果是“阻止”，然后将其从“阻止”更改为“无”）。基本上：
if (item.style.display == "none")
{
item.style.display = "block";
}
else if (item.style.display == "block")
{
item.style.display = "none";
}
我给元素提供了一个ID（id =“ item”），但是由于某些原因，我的javascript函数无法读取item.style.display
[当我发出警报（item.style.display）时，我得到一个空警报。在以下代码中，我没有收到任何警报。
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style>
#item
{
display: none;
}
</style>
<script>
function showalert()
{
var item = document.getElementById('item');
if (item.style.display == "none")
{
alert("Not shown");
}
else if (item.style.display == "block")
{
alert("shown");
}
}
</script>
</head>
<body>
<div id="item">
Div item
</div>
<button onClick="showalert()">Click Me</button>
</body>
</html>我以前做过，但是似乎无法复制。我在这里阅读了一堆答案，当脚本移至文档末尾时，大多数答案都已解决。但是，我只在脚本中定义了该函数，并在div元素之后的文档末尾运行了该函数。
有人可以告诉我我做错了什么吗？预先感谢。
您的html DIV错误，您需要将样式显示在IF作品的元素上：
<div id="item" style="display:none;">
Div item
</div>
<button onClick="showalert()">Click Me</button>
function showalert()
{
var item = document.getElementById('item');
if (item.style.display == "none")
{
alert("Not shown");
}
else if (item.style.display == "block")
{
alert("shown");
}
}
因此，如果元素DIV的显示为空，则警报为“未显示”
没有<script>或直接在JS中设置属性，就无法访问CSS样式表（和window.getComputedStyle标记设置的样式）。>
这是直接在JS中设置属性的示例：
window.getComputedStyle以及使用<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style>
#item {
display: none;
}
</style>
</head>
<body>
<button onclick="toggle()">Click Me</button>
<div id="item">
Div item
</div>
<script>
var item = document.getElementById("item");
item.style.display = "none";
function toggle() {
item.style.display = item.style.display === "none" ? "block" : "none";
}
</script>
</body>
</html>的示例，该示例返回动态更新的实时getComputedStyle对象：
或者，JS可以立即使用内联样式，但这不是特别可扩展的解决方案。
CSSStyleDeclaration脚本，将其包装在<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style>
#item {
display: none;
}
</style>
</head>
<body>
<button onclick="toggle()">Click Me</button>
<div id="item">
Div item
</div>
<script>
const item = document.getElementById("item");
const itemStyle = getComputedStyle(item, null);
function toggle() {
item.style.display = itemStyle.display === "none" ? "block" : "none";
}
</script>
</body>
</html>函数中，或直接将其移至页面底部也是一个好主意。这样可以避免JS尝试访问尚未加载的DOM元素的情况。
您应该在“ none”和“”（空字符串）之间切换显示属性，以便替代方法是默认或继承的显示值，例如]]
defer