Question

有人可以告诉我下面的代码有什么问题吗？我想要＆＃39; the_text＆＃39;在按钮单击时可见或不可见。 mystyle.css有：

#the_text {
    visibility: hidden;
}

我的html页面：

<html>
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">

</head>
<body>

<button type="button" onClick = "check_this_out()">Show/hide</button>

<div id="the_text"> I want to hide this by pressing the button above</div>

<script>
function check_this_out() {
var vis_or_hidden = document.getElementById("the_text");

if vis_or_hidden.style["visibility"] = "hidden"

{vis_or_hidden.style["visibility"] = "visible"}

else

{vis_or_hidden.style["visibility"] = "hidden"}
 }
</script>
</body>
</html>

Answer 1

function定义存在一些问题。

第一个是语法错误，因为if statements需要围绕条件括号。
```
if (vis_or_hidden.style["visibility"] = "hidden")
```
接下来是条件实际为assigning (=)而不是comparing (==, ===)。
```
if (vis_or_hidden.style["visibility"] == "hidden")
```
注意：if语句不需要布尔条件，因此您不会在它们之间突出显示类型错误。但是，由于无法分配文字，因此反转操作数可以：
```
if ("hidden" = vis_or_hidden.style["visibility"])
// ReferenceError: Invalid left-hand side in assignment
```
VS
```
if ("hidden" == vis_or_hidden.style["visibility"])
```
最后一个是DOM的常见问题，因为style property仅表示元素自己的内联样式，并且它还没有自己的visibility。要包含从样式表继承的样式，您必须确定computed style：
```
if (window.getComputedStyle(vis_or_hidden)["visibility"] == "hidden")
```
但请注意，IE8 and older不支持getComputedStyle()。对于跨浏览器兼容性，您必须混合使用currentStyle。

其中一个选项是Quirks Mode's getStyle()。另一个是taking a snippet from jQuery。但是，还有许多其他垫片和填充物可以找到。

示例：http://jsfiddle.net/Ae426/（使用No wrap时请注意onclick选项。）

为什么我的javascript if else语句不起作用？

1 个答案: