Html <；div样式显示="；无”&燃气轮机；在桌子里面不工作

我正在尝试使用javascript切换具有标签和文本框的div元素的显示。 下面是代码片段

<table id="authenticationSetting" style="display: none">
<div id="authenticationOuterIdentityBlock" style="display: none;">
                <tr>

                    <td class="orionSummaryHeader"><orion:message key="policy.wifi.enterprise.authentication.outeridentitity"/>: </td>
                    <td class="orionSummaryColumn">
                        <orion:textbox id="authenticationOuterIdentity" size="30"/>
                    </td>

                </tr>
                </div>

            </table>

: 

但是，在页面加载时，div元素仍然显示，table元素的显示切换工作正常。 我不知道这为什么不起作用，可能是table元素的样式覆盖了div元素的样式。

---

另外，我仍然能够隐藏div中的元素，但不能隐藏div本身。

从语义上讲，您尝试的是无效的html，

表

元素不能将

div

元素作为直接子元素。您可以做的是，将

div

元素放入

td

元素中，然后尝试隐藏它

只需将

更改为

:

看起来您正在将一个

div

放在不应该放的地方；包裹在

tr

元素周围。

标记内的

标记。语法不正确。您的html是invlid，表中应该有

tr

然后是

td

，在

td

内部，您的内容应该被添加，所以您说div元素不应该包装tr元素。是否有其他方法可以切换表格行的显示？可能重复此操作，但这会破坏我表格的现有样式…想知道为什么会发生这种情况-正确，很好的解决方案，但会破坏表格的布局可见性：可以使用隐藏（而不是显示：无）如果要隐藏某个元素，但仍希望它像未隐藏一样影响布局。

<table id="authenticationSetting" style="display: none">
  <tbody id="authenticationOuterIdentityBlock" style="display: none;">
    <tr>
      <td class="orionSummaryHeader">
        <orion:message key="policy.wifi.enterprise.authentication.outeridentitity" />:</td>
      <td class="orionSummaryColumn">
        <orion:textbox id="authenticationOuterIdentity" size="30" />
      </td>
    </tr>
  </tbody>
</table>