在文档准备好之前隐藏元素？答案

【问题标题】：Hiding element before document is ready?在文档准备好之前隐藏元素？
【发布时间】：2013-02-05 19:01:20
【问题描述】：

我有一个需要默认隐藏的 div。然后可以通过按钮进行切换：

    <script type="text/javascript">
        function toggle() {
            text = document.getElementById('add_view');
            var isHidden = text.style.display == 'none';
            text.style.display = isHidden ? 'block' : 'none';
        }


        $(document).ready
    (

              function () {
                  toggle();
                  $("#add_view, #btnToggle").click(function (e) {
                      e.stopPropagation();
                  });
                  $(document).click(function () {
                      toggle();
                  });
              }
    );


</script>

它工作正常。唯一的问题是，当我刷新页面时，我会在隐藏之前看到 div。

我能做些什么来防止这种情况发生？

谢谢

【问题讨论】：

如果您对其中一个答案感到满意，请不要忘记将其中一个答案标记为正确

标签： c# javascript jquery asp.net html

【解决方案1】：

您可能需要默认隐藏元素，然后使用按钮切换可见性。试试这个：

<div id="add_view" style="display:none">....</div>

【讨论】：

第一个回答问题，分数比别人少，真是令人沮丧
感谢@RobertNiestroj，这在 SO 中经常发生。如果两个答案相同，我只赞成第一个给出答案，我认为这样是公平的。您可以通过将鼠标悬停在以下部分轻松查看确切的回答时间：answered xx mins ago
不知道具体时间

【解决方案2】：

将元素隐藏在您的 html 中开始。

<div id="add_view" style="display: none;"></div>

【讨论】：

【解决方案3】：

最初，您必须通过设置 div 的style="display:none;" 来隐藏它。一旦你想切换它，你必须将它用作

document.getElementById(Id).style.display="";

在 JavaScript 中。

【讨论】：