0

PHPで生成された単純なテーブルがあります。

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

JavaScript または CSS を使用してページを読み込むときに、3 行目を非表示にしたいと考えています。3 行目の ID を指定せずにこれを行う方法はありますか?

前もって感謝します

4

5 に答える 5

4

css3 では :nth-child セレクターを使用できます

#control tr:nth-child(3)
{
   display:none;
}
于 2013-10-26T14:13:59.113 に答える
1

これを試して

 document.getElementsByTagName("tr")[2].style.display = 'none';
于 2013-10-26T14:19:07.133 に答える
1

純粋な 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>
于 2013-10-26T14:26:10.310 に答える
0

jQuery を使用eq(int)して、0 から始まるインデックスの行を選択します。

$("#control tr").eq(2).hide();
于 2013-10-26T14:13:08.737 に答える