关于 Visible=false 和 display:none 的问题；答案

【问题标题】：Question regarding Visible=false and display:none;关于 Visible=false 和 display:none 的问题；
【发布时间】：2011-10-17 22:57:40
【问题描述】：

如果我设置某些控件的属性 Visible="false"，我无法在我的 aspx 页面生成的 HTML 中看到该控件。但是当我在该控件的样式标记中使用 display:none 时，我看到该控件在 HTML 中显示为灰色。这是为什么呢？

另外，如果我发现页面上不再需要一些控件：-

我应该从我的页面中将其注释掉吗？
我应该设置它的属性 Visible=false"
我应该设置 display:none 吗？

牢记时间限制和页面重量的最佳方法是什么？

下面是我的测试页面生成的 HTML：-

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> </title>
</head>
<body>
<form id="form1" action="testvisibility.aspx" method="post" name="form1">
<div>
<input id="__VIEWSTATE" type="hidden" value="/wEPDwUKMTY2NDk3NDQzNQ9kFgICAw9kFgQCBw8PFgIeB1Zpc2libGVoZGQCCQ8WAh4Fc3R5bGUFDWRpc3BsYXk6bm9uZTtkZEjYzMWMovvrGmuSrQHwc5ZXgqXCrf+lekz1GgsdjUd+" name="__VIEWSTATE">
</div>
<div>
visiblelabel::
<span id="visiblelabel">visiblelabel</span>
<br>
labelwithvisiblefalseonaspx::
<br>
labelwithdisplaynoneonaspx::
<div style="display: none;">
<span id="labelwithdisplaynoneonaspx">labelwithdisplaynoneonaspx</span>
</div>
<br>
labelwithvisiblefalseonserverside::
<br>
labelwithdisplaynoneonserverside::
<div id="divforlabelwithdisplaynoneonserverside" style="display: none;">
<span id="labelwithdisplaynoneonserverside">labelwithdisplaynoneonserverside</span>
</div>
<br>
</div>
</form>
</body>
</html>

【问题讨论】：

标签： c# asp.net html

【解决方案1】：

如果您想通过 Ajax/etc 动态显示或隐藏控件，或者如果控件包含您的页面所需的信息，请在 CSS 中设置 display:none。

如果您根本不想在某些情况下呈现控件，请设置Visible="false"。由于它将控件的 HTML 保留在页面之外，因此页面会稍微小一些——但如果您想通过 Ajax/etc 显示控件，这将不起作用。

如果您根本不想呈现控件，句号，请不要将其注释掉 - 将其完全删除。所有控件，无论是否可见，仍然需要处理，因此如果您从不打算呈现控件，则 Visible=false 会浪费 CPU（并可能导致副作用）。而且你真的不希望有很多被注释掉的东西漂浮在周围；它只会使维护变得更加困难。如果您以后发现确实需要它，您总是可以从您的修订控制中取回它。（您正在使用 SVN/Git/CVS/某事，对吗？）

【讨论】：

【解决方案2】：

Visible 属性是控件上的一个属性 - 当设置为 false 时，控件根本不会呈现。这比设置display:none 好得多，在这种情况下，控件以display:none 样式呈现，因此浏览器不会显示它。

如果您不希望控件可见，display:none 会很有用，但它包含一些您想在客户端上使用的数据（例如，通过 Javascript）。在这种情况下，将 Visible 属性设置为 false 将不起作用。

【讨论】：

谢谢@Petar，是的，如果我们想通过 Javascript 操作内容，那么我们应该使用 display>none 否则它将不起作用

【解决方案3】：

我不能说哪个更好，这取决于情况。如果您想在客户端站点中使用该控件（即想要通过 JavaScript 访问该控件），您必须将显示设置为无。但如果您在客户端不需要它，最好将可见设置为 false。

【讨论】：

【解决方案4】：

我认为重要的区别在于您是否需要在客户端访问面板内的项目。设置 visible=false 将导致面板不被渲染，因此您无法访问任何控件，再次，客户端。然而，如果您设置不显示，那么您将可以访问控件，因为面板已呈现。对可见=假的更多关注避免验证。

【讨论】：