Question

如何使用JavaScript或内联CSS隐藏<td>标记？

Answer 1

.hide{

visibility: hidden

}

<td class="hide"/>

修改 - 只为你

显示和可见性之间的差异就是这个。

“display”：有许多属性或值，但您关注的是“无”和“阻止”。 “none”就像一个隐藏值，“block”就像show。如果您使用“无”值，您将完全隐藏您已应用此css样式的html标记。如果您使用“阻止”，您将看到html标记及其内容。非常简单。

“visibility”：有很多值，但我们希望了解有关“隐藏”和“可见”值的更多信息。 “隐藏”将以与显示的“块”值相同的方式工作，但这将隐藏标记及其内容，但它不会隐藏该标记的物理空间。例如，如果您有几个文本行，那么和图像（图片），然后是一个包含三列和两行图标和文本的表。现在，如果您将具有隐藏值的可见性css应用于图像，则图像将消失，但图像所使用的空间将在其中进行重新映射，换句话说，您将以文本和文本之间的大空间（孔）结束。桌子。现在，如果您使用“可见”值，您的目标标记及其元素将再次可见。

Answer 2

你期望在它的位置发生什么？该表无法重排以填充剩余的空间 - 这似乎是错误的浏览器响应的一个秘诀。

考虑隐藏td的内容，而不是td本身。

Answer 3

你隐藏任何东西的方式相同：visibility: hidden;

Answer 4

<td style = "display:none" >
<p> Content display none </p>
</td>

或

<td style="visibility:hidden"> Your content is hidden </td>

请注意：2这些方式是不同的。您应该尝试检查结果。

Answer 5

使用css可以（或几乎）一切，只需使用：

display: none; //to hide

display: table-cell //to show

Answer 6

如果你在javascript中有更多这个，请考虑一些javascript库，例如jquery会带走一点速度，但会为您提供更易读的代码。

您的问题代码来自jquery：

$("td").hide();

当然还有其他javascript库，正如this comparison on wikipedia所示。

Answer 7

您只需添加一个样式属性即可隐藏<td>代码内容：style = "display:none"

例如

<td style = "display:none" >
<p> I'm invisible </p>
</td>

Answer 8

我们可以使用以下内联css隐藏内容：

<div style="visibility:hidden"></div>

例如：

<td><div style="visibility:hidden">Your Content Goes Here:</div></td>

如何使用内联JavaScript或CSS隐藏TD标签？

8 个答案: