Fatal编程技术网

试图用javascript使div消失

javascript jquery html css

试图用javascript使div消失,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我正试图用javascript使div消失。它就是不起作用。我做错了什么 <script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript"> document.getElementById("des").style.visibility = "hidden"; </script> <div

我正试图用javascript使div消失。它就是不起作用。我做错了什么

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">    
    document.getElementById("des").style.visibility = "hidden";    
</script>    

<div id="des">
  Text.
  <a href="">link</a>    
</div>


document.getElementById（“des”）.style.visibility=“hidden”；
文本。
为什么不使用JQuery
hide（）
方法，因为您已经在使用JQuery，而且很明显代码要包含在
$（document.ready（function（）{\\some code}）
或
$（window.load）（function（）{\\some code}）

在JS中，您可以通过

document.getElementById("des").style.display = "none";
您正在加载DOM之前运行脚本

如果将脚本放在div之后，它将工作

它是：

document.getElementById("des").style.display = "none";
您还可以使用：

document.getElementById("des").style.display = "block";
使它再次可见

无论如何，这是我首选的方法。

试着在代码周围放一个准备好的文档

如果您正在加载jquery，那么只需执行
$（'#des'）.css（'visibility'，'hidden'）
或
$（'#des'）.hide（）


$（文档）.ready（函数（）{
$（'des'）.css（'visibility'，'hidden'）；
});
在创建元素之前，您正在尝试获取id为“des”的元素

<div id="des">
    Text.
<a href="">link</a>

</div>

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">

document.getElementById("des").style.visibility = "hidden";

</script>


文本。
document.getElementById（“des”）.style.visibility=“hidden”；
这应该是可行的。

您应该将脚本包装在
$（文档）中。ready
阻塞，因为您在加载DOM之前调用脚本

所以，你必须这样做

<script type="text/javascript">
   $(document).ready(function() {
     document.getElementById("des").style.visibility = "hidden";
   });   
</script>


$（文档）.ready（函数（）{
document.getElementById（“des”）.style.visibility=“hidden”；
});
您需要等待文档准备就绪。尝试使用：

$（文档）.ready（函数（）{
document.getElementById（“des”）.style.visibility=“hidden”；
});

或者您可以使用JQuery：


$（documet）.ready（函数（）{
$（“.des”）.hide（）；

});
Javascript是一种基于interepreter的语言，如果您想先编写脚本，然后再使用，请添加一个函数


<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">    
    function hideMyDiv(){
       document.getElementById("des").style.visibility = "hidden";    
    }
</script>    

<div id="des">
  Text.
  <a href="">link</a>    
</div>

<script type="text/javascript">    
   hideMyDiv();
</script>




函数hideMyDiv（）{
document.getElementById（“des”）.style.visibility=“hidden”；
}
文本。
hideMyDiv（）；



干杯
 当我将javascript代码放在函数中并在主体加载时加载它时，这对我来说是有效的，例如


<script>
  function func(){
    document.getElementById("der").style.visibility = "hidden";
  }
</script>

<body onload=func()>
  <div id="der">
    test
  </div>
</body>




函数func（）{
document.getElementById（“der”）.style.visibility=“hidden”；
}
测试

出于好奇，您显然不介意使用jquery，因为您的代码片段中包含了jquery—为什么不使用jquery？“它就是不起作用”是一种很糟糕的描述问题的方式。检查控制台中的错误。您可能已经自己找到了答案，因为它会告诉您，由于您的
#des
尚未呈现，您将获得与NullPointerException相当的JavaScript，为什么您要使用JS？它只是为了学习还是为了实际应用？如果是前者，那就好了。但是，如果这是用于您的产品代码，那么我建议您只使用直接向上的CSS。@DRD在某些情况下，使用CSS是没有意义的。您是否建议创建一个名为
.hidden
的类并将其应用于元素？它不能解决问题，而且语义也不是很好。@neminem我不是专业程序员，所以我结合了教程中的代码，所以一些人使用一种东西，另一些人使用另一种东西。当我把它们组合在一起时，我会迷失在其中，因为我没有太多经验，它会变成一个奇怪的组合。看，这与OP所做的没有太大区别。OP也可以将代码包装在
$（文档）.ready
并将其放在标题中。@MattD将其放在HTML之后会使其运行得更快，这样它就不会在速度较慢的机器上/长时间闪烁documents@JuanMendes没错，我或多或少注意到还有其他选择。然而，如果
div
应该在页面加载时隐藏，那么似乎更好的设计选择是将其
display
属性设置为none，然后让OP编写脚本，以确定何时应该显示它。@MattD是的，根据OP所说，他们将打电话查看用户是否已登录，然后将其隐藏。最好先把它藏起来，然后再展示出来。

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">    
    function hideMyDiv(){
       document.getElementById("des").style.visibility = "hidden";    
    }
</script>    

<div id="des">
  Text.
  <a href="">link</a>    
</div>

<script type="text/javascript">    
   hideMyDiv();
</script>



<script>
  function func(){
    document.getElementById("der").style.visibility = "hidden";
  }
</script>

<body onload=func()>
  <div id="der">
    test
  </div>
</body>