使表格边框里的<tr> </tr>不显示出来的代码是啥
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了使表格边框里的<tr> </tr>不显示出来的代码是啥相关的知识，希望对你有一定的参考价值。
例如我的网页:
<body>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#0000FF">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="131" align="center" valign="middle">1、这个表格是广告，需要隐藏此<tr> </tr>里的内容</td>
</tr>
<tr>
<td height="32" align="center" valign="middle">2、如果这个表格也需要隐藏，怎么修改</td>
</tr>
<tr>
<td height="32" valign="top">3</td>
</tr>
</table>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#FF0000" bgcolor="#FFFFFF">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="195" valign="top">4</td>
</tr>
</table>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="66" valign="top">5 </td>
</tr>
</table>
</body>
</html>
想要隐藏第一个<table> </table>中的第一个<tr> </tr>里面的内容，这个javascript该如何实现，Javascript要求放在</html>后面。
第二，如果想要继续隐藏第一个<table> </table>中的第二个<tr> </tr>里面的内容，又应该如何添加Javascript。
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#0000FF">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="131" align="center" valign="middle">1、这个表格是广告，需要隐藏此里的内容</td>
</tr>
<tr>
<td height="32" align="center" valign="middle">2、如果这个表格也需要隐藏，怎么修改</td>
</tr>
<tr>
<td height="32" valign="top">3</td>
</tr>
</table>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#FF0000" bgcolor="#FFFFFF">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="195" valign="top">4</td>
</tr>
</table>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="66" valign="top">5 </td>
</tr>
</table>
</body>
</html>
<script>
var table=document.getElementsByTagName("table");
table[0].childNodes[1].childNodes[0].style.display="none"; //第一个tr
table[0].childNodes[1].childNodes[1].style.display="none"; //第二个tr
</script>本回答被提问者采纳 参考技术B <body>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#0000FF">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="131" align="center" valign="middle" id=-"guagao" style="display:none">1、这个表格是广告，需要隐藏此里的内容</td>
</tr>
<tr>
<td height="32" align="center" valign="middle" id="aa" style="display:none">2、如果这个表格也需要隐藏，怎么修改</td>
</tr>
<tr>
<td height="32" valign="top">3</td>
</tr>
</table>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#FF0000" bgcolor="#FFFFFF">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="195" valign="top">4</td>
</tr>
</table>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="66" valign="top">5 </td>
</tr>
</table>
</body>
</html> 参考技术C <tr style="display:none">
<td width="1003" height="131" align="center" valign="middle">1、需要隐藏此内容</td>
</tr>
其实隐藏就是给他一个隐藏的样式就行了
如果需要控制显示（或显示）出来就要给元素加一个ID属性
如
<tr style="display:none" id="tr1">
<td width="1003" height="131" align="center" valign="middle">1、需要隐藏此内容</td>
</tr>
<tr><td><button onclick="document.getElementById('tr1').style.display=''">显示广告</button><button onclick="document.getElementById('tr1').style.display='none'">隐藏广告</button></td></tr> 参考技术D 用div来解决
style="position:absolute;z-index:1;visibility:hidden"
visibility:下边的改为hidden 你可以看到效果
<body>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#0000FF">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="131" align="center" valign="middle">1、这个表格是广告，需要隐藏此<div id="article" style="position:absolute;z-index:1;visibility:visible">1111111</div> 里的内容</td>
</tr>
<tr>
<td height="32" align="center" valign="middle">2、如果这个表格也需要隐藏，怎么修改</td>
</tr>
<tr>
<td height="32" valign="top">3</td>
</tr>
</table>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#FF0000" bgcolor="#FFFFFF">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="195" valign="top">4</td>
</tr>
</table>
<table width="1003" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
<!--DWLayoutTable-->
<tr>
<td width="1003" height="66" valign="top">5 </td>
</tr>
</table>
</body>
</html>
下边的同理：<tr>不能乱用，要不显示出来的网页可能要变形的……^_^ 第5个回答 2015-08-11 没法设置tr隐藏的，通常是div中包含表格，设置的div隐藏。直接设置相应的div中display属性为none即可。
举例：
<div id="div" style="display: none" >
<form id='modify1' name="modify1" method="post" enctype="multipart/form-data" action="$ctx/report/rate_exchange.jsp" >
<table class="table_common" id="table1" cellspacing="1" cellpadding="0">
<tr class='title_tr' style="white-space: nowrap; text-align: center;" >
<td style="white-space: nowrap; text-align: center;" colspan="1">
<input type="button" style="white-space: nowrap; text-align: center;" />
</td>
</tr>
</table>
</form>
</div>
以上是关于使表格边框里的<tr> </tr>不显示出来的代码是啥的主要内容，如果未能解决你的问题，请参考以下文章