Question

要么＆＃39; y＆＃39;或者＆＃39; n＆＃39;传递到我的JavaScript。我需要在我的HTML中显示一个div，如果＆＃39; y＆＃39;传递，如果＆＃39; n＆＃39;隐藏它。我目前有这个。

<script type="text/javascript">
    if(category = 'y'){
            var x = document.getElementsByClassName("mydiv");
            x.style.display = 'block';
    }else
            x.style.display = 'none';

</script>
<html>
<div class="mydiv">
  <p><h1>Weather</h1></p>
</div>

</html>

div总是被显示而且这个词被忽略了，我哪里错了？感谢

Answer 1

使用＆＃34; ===＆＃34;当您将类别与＆＃39; y＆＃39;

进行比较时

Answer 2

首先，你的if语句应为if(category == 'y') 当只使用一个=符号时，您告诉解释器将值“y”赋给变量名category

其次，getElementsByClassName返回元素集合，因此您需要从结果集合中选择一个元素，例如：

var x = document.getElementsByClassName("mydiv")[0];

注意我是如何从数组中选择第一个元素的。这是完整的代码：

<script type="text/javascript">
    var x = document.getElementsByClassName("mydiv")[0]; // should be outside of the if statement
    if(category == 'y'){
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    } 
</script>

Answer 3

你做错了几件事。

使用===，而不是=。后者用于作业。
在元素之后添加脚本或将其包装在函数中，否则它将在元素存在于网站上之前执行
getElementsByClassName返回一个数组，而不是单个元素
在if语句中定义变量时，else块中无法使用
在某处定义了category？

<div class="mydiv">
  <p><h1>Weather</h1></p>
</div>
<script type="text/javascript">
    (function() {
      var category = 'n';
      var x = document.getElementsByClassName("mydiv")[0];
      x.style.display = (category === 'y') ? 'block' : 'none';
    })();
</script>

Answer 4

你有两个问题。首先，getElementsByClassName()返回一个HTML集合，而不是将索引传递到该集合中以正确引用该集合中您需要的特定元素，您试图在集合本身上设置style属性。

接下来，您的if语句使用=代替===。 =设置一个值，该值（在if语句中）将始终评估为true。您需要进行比较，因此需要==或===运算符。

最后，移动您的script标记，使其在使用的HTML之后发生。在将元素解析到内存之前查询元素将导致元素无法找到。

var x = document.querySelector(".mydiv");
var category = prompt("Enter 'y' or 'n'");
if(category === 'y'){
  x.style.display = 'block';
} else {
  x.style.display = 'none';
}

<div class="mydiv">
  <h1>Weather</h1>
</div>

Answer 5

你需要纠正：

比较，因此请使用==代替=
需要使用索引来访问元素，例如getElementsByClassName("mydiv")[0];原因是getElementsByClassName返回一个集合，注意api中的复数名称。
另外，需要在if / else块之外取出var x。否则，block将无法访问x。

参见示例：

＆＃13;

function test() {
        var category = 'n';
        var x = document.getElementsByClassName("mydiv")[0];
        if (category == 'y') {
            
            x.style.display = 'block';
        } else
            x.style.display = 'none';
    }

＆＃13;

<button class="btn btn-success" id="buttonCode" type="button" onclick="test()">test</button>
<div class="mydiv">
  <p><h1>Weather</h1></p>
</div>

＆＃13;

Javascript隐藏/显示传递的术语div

5 个答案: