禁用 CSS 时如何隐藏 div？答案

【问题标题】：How can you hide a div when CSS is disabled?禁用 CSS 时如何隐藏 div？
【发布时间】：2011-10-11 02:32:03
【问题描述】：

这是场景：我有一个 div，我将它预加载到页面中并自动将其显示属性设置为隐藏。我使用javascript弹出说div。问题是当客户禁用 CSS 时，他们显然可以看到 DIV。仅在调用我的 javascript 函数时才显示 div（或 div 的内容）的最佳方法是什么？

我能想到的最好方法是将原始 HTML 传递给 javascript var，然后使用 javascript 加载所有 HTML，但是，这有点慢（有相当数量的 HTML），这会导致脚本在它会尝试引用尚不存在的 DIV。

还有其他更优雅的解决方案吗？

谢谢

【问题讨论】：

【解决方案1】：

您希望在页面加载时在页面上有一个 div，以便没有 javascript 的用户可以看到它，也许是为了向他们表明某些网站功能需要 JS 才能工作。

如果您需要在 JS 中专门使用该 div，那么将其放在页面上是一种不好的方法恕我直言。您应该即时创建它，至少是内容。

这样您将确保没有 CSS 的用户不会看到它，同时仍然能够向其他启用 JS 的人展示它。

【讨论】：

【解决方案2】：

你可以在它周围包裹 html 注释标签：

<!-- <div>your stuff, which should be invisible</div> -->

或将其从 DOM 中完全删除

【讨论】：

【解决方案3】：

使用 javascript 将要隐藏的 div 的高度设置为零。

$('#mydiv').css("height", "0px");

【讨论】：

【解决方案4】：

您可以在 div 上设置内联样式（不推荐，但无论如何您的情况是个例外）。

您可以在页面加载时使用 JS/jQuery 来隐藏 div，但这会导致闪烁效果（div 会暂时可见，直到 JS 运行以隐藏它）。

【讨论】：

【解决方案5】：

如果 CSS 被禁用，那么隐藏 div 的唯一方法就是将其从 DOM 中移除。

【讨论】：