用HTML消失的内容

debugcn 发表于 Dev

编码器9927

我当时在玩一些html，以为我可能会遇到可以用于我的网站的内容。好吧，当我在使用html时，我遇到了隐藏html内容的问题，所以我想到了一个可以做到这一点的代码。这是我的代码。

<input type = "checkbox"  id = "on"></input>
<button onclick = "myFunction()">Dissappear.</button>
<p id = "demo">Html is the best</p>
<script>
function myFunction(){
var b = document.getElementById("on").value
if(b =="on"){
document.getElementById("demo").style.visibility = "hidden"
}
}
</script>

我想知道这是执行此操作的最有效方法，还是可以占用最少的存储量。如果没有，请帮忙。谢谢。

伊姆兰·拉菲克（Imran Rafiq Rather）

您在此处以错误的方式使用了复选框。我们必须checked代之以财产

if(b =="on"){
  document.getElementById("demo").style.visibility = "hidden"
}

b=="on" 是一个真实的字符串，并且始终是真实的。

另外，最好使用display:none;代替hidden。

document.getElementById("demo").style.display= "none";

完整的工作代码：只有当输入被选中，我们点击下面的DIV应该会消失（这使得在这个例子中更有意义）。尝试这个

<input type = "checkbox"  id = "on"></input>
<button onclick = "myFunction()">Dissappear.</button>
<p id = "demo">Html is the best</p>
<script>
function myFunction(){
   var b = document.getElementById("on");
   console.log(b);
  if(b.checked){
    document.getElementById("demo").style.display = "none";
  }
}
</script>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。