我是 javascript 的新手，我正在尝试使用它来切换多个元素的显示。我已经编写了一个脚本来切换单个元素，但我的实际站点包含多个不同页面上的多个元素，因此我想编写一个可以在许多不同元素上重复使用的函数。
示例页面可能是:
<html>
<head>
<title>Some | Page</title>
</head>
<body>
<h1 id="pepper" onclick="changeDisplay('greendiv')">Click Here</h1>
<div id="greendiv" style="height:200px; width:200px"></div>
<script type="text/javascript">
function changeDisplay('id') {
var styleState = document.getElementById('id');
var divState = document.getComputedStyle('id').display;
if (divState == 'none') {
styleState.style.display = 'block';
} else if (divState == 'block') {
styleState.style.display = 'none';
} else {
alert("Error");
}
}
</script>
</body>
</html>
仅在实际站点上，我引用了包含代码的外部脚本文件 <head>标签，这样我就可以在很多页面上使用相同的脚本。如果从代码中看不出来，目的是让我能够单击 <h1>标签制作<div>消失又重现。我不知道 jQuery，虽然我最近得到了一本关于它的书，但我还没有时间开始阅读，但我敢打赌它会让它变得更简单。
我认为它是非常简单的东西，它总是让我失望的非常简单的东西......
如果有人能解释我的代码中的错误，我将真的感激不尽。
糟糕，遗漏了实际问题:代码没有做任何事情。当我点击 <h1>元素，没有任何反应，甚至没有警告框。
最佳答案
(添加正确的答案而不是将其作为评论留下)
1) changeDisplay('id') 应该是 changeDisplay(id)。变量周围没有任何引号。 document.getElementById
2) divState 应该等于styleState.style.display。
关于javascript - 可重复使用的 JavaScript 切换函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18218968/