gpt4 book ai didi

javascript - 可重复使用的 JavaScript 切换函数

转载 作者:太空宇宙 更新时间:2023-11-04 14:42:00 25 4
gpt4 key购买 nike

我是 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/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com