如何通过JavaScript显示隐藏的div？

Question

如果要关闭javascript我想隐藏一个div ，如果启用了javascript ，我要显示该div ，但是我不想像Chrome和Opera中那样使用<noscript> ，它有一些问题。 所以我正在做的是这样的：

<div id="box" style="display:none"></div>
<script type="text/javascript">
document.getElementById("box").style.visibility = "visible";
</script>

但是javascript部分未显示div。 启用javascript后，如何使其可见。 还尝试了$('#box').show(); 但这也不起作用。

Answer 1

使用style.display

document.getElementById("box").style.display = "block";

Answer 2

您需要将属性display设置为“ block

document.getElementById("box").style.display = "block";

您试图在可见性之间切换，这是相似的，但是属性不同。

Answer 3

您正在使用显示：无，不是可见性：隐藏。 解决方案增加了可见性：如果要使用它而不是显示，则不显示而不显示。 他们的工作有些不同。

Answer 4

您可以设置：

<div id='box' style='display: none;'>...</div>

在您的脚本代码中：

document.getElementById('box').style.display = 'block';

Answer 5

将显示更改为可见性

<div id="box" style="visibility:none"></div>
<script type="text/javascript">
document.getElementById("box").style.visibility = "visible";
</script>

或更改js

<div id="box" style="display:none"></div>
    <script type="text/javascript">
         document.getElementById("box").style.display = "block";
    </script>

Answer 6

您还可以混合使用CSS和Javascript来完成此操作：

HTML / Javascript

<script type="text/javascript">
    document.documentElement.className += 'js-ready';
</script>

的CSS

div#box { display: none; }
.js-ready div#box { display: block !important; }