隐藏表格中没有ID的特定行

Question

I have simple table generated by PHP. 我有由PHP生成的简单表。

<table border="1" id="control>
    <tbody>
        <tr>...</tr>
        <tr>...</tr>
        <tr>...</tr>  //Row #3
        <tr>...</tr>
        <tr>...</tr>
        <tr>...</tr>
    </tbody>
</table>

I would like to hide 3rd row when page loads using javascript or css. 使用JavaScript或CSS加载页面时，我想隐藏第三行。 Is there any way to do this without giving 3rd row ID? 有没有办法提供第三行ID？

Thank you in advance 先感谢您

Answer 1

使用jquery非常简单， $('#control tr:eq(2)').hide()

Answer 2

with css3 you can use the :nth-child selector 使用css3，您可以使用：nth-child选择器

#control tr:nth-child(3)
{
   display:none;
}

Answer 3

尝试这个

 document.getElementsByTagName("tr")[2].style.display = 'none';

Answer 4

Using pure JavaScript (no framework like JQuery etc.) one can do: 使用纯JavaScript（没有JQuery等框架）可以做到：

<!DOCTYPE html>
<html>
<head>
    <title>HTML</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
    <table border="1" id="control">
        <tbody>
            <tr><td>row1</td></tr>
            <tr><td>row2</td></tr>
            <tr><td>row3</td></tr>
            <tr><td>row4</td></tr>
            <tr><td>row5</td></tr>
            <tr><td>row6</td></tr>
        </tbody>
    </table>
    <script type="text/javascript">
        var tableElm = document.getElementById("control");
        var tableChilds = tableElm.getElementsByTagName("tr");
        var row3 = tableChilds[2];
        row3.style.display = "none";
        // alternatively:
        //row3.style.visibility = "hidden";
    </script>
</body>
</html>

Answer 5

使用jQuery的eq(int)选择从零开始的索引处的行：

$("#control tr").eq(2).hide();

隐藏表格中没有ID的特定行

问题描述

5 个解决方案

解决方案1
5 2013-10-26 14:10:50

解决方案2
4 已采纳 2013-10-26 14:13:59

解决方案3
1 2013-10-26 14:19:07

解决方案4
1 2013-10-26 14:26:10

解决方案5
0 2013-10-26 14:13:08

隐藏表格中没有ID的特定行

问题描述

5 个解决方案

解决方案1 5 2013-10-26 14:10:50

解决方案2 4 已采纳 2013-10-26 14:13:59

解决方案3 1 2013-10-26 14:19:07

解决方案4 1 2013-10-26 14:26:10

解决方案5 0 2013-10-26 14:13:08

解决方案1
5 2013-10-26 14:10:50

解决方案2
4 已采纳 2013-10-26 14:13:59

解决方案3
1 2013-10-26 14:19:07

解决方案4
1 2013-10-26 14:26:10

解决方案5
0 2013-10-26 14:13:08