9

これが私のテーブルだとします：

<table>
    <tr id="a">
       <TD>a</TD>
    </tr>
    <tr id="b">
       <TD>b</TD>
    </tr>
</table>

テーブルの行インデックスを使用して行 ID を取得するにはどうすればよいですか?

上記は id が静的な例ですが、私の場合は id が動的であるため、 document.getElementById().

4

3 に答える 3

13

ページにテーブルが 1 つしかない場合:

document.getElementsByTagName("tr")[index].id;

ただしtable、 aidを指定して、次のように行を取得することをお勧めします。

<table id="tableId">
    <tr id="a">
        <td>a</td>
    </tr>
    <tr id="b">
        <td>b</td>
    </tr>
</table>

var table = document.getElementById("tableId");
var row = table.rows[index];
console.log(row.id);

このようにして、ページに複数のテーブルがある場合でも、干渉を受けないようにすることができます。

于 2012-12-06T14:58:52.033 に答える
4

「では、テーブルから行インデックスを使用して行 ID を取得するにはどうすればよいですか」

を選択しtable、プロパティを使用し.rowsてインデックスで行を取得します。

var table = document.getElementsByTagName("table")[0]; // first table

var secondRow = table.rows[1]; // second row

次に、通常の方法で ID を取得します。

console.log(secondRow.id); // "b"

デモ: http://jsfiddle.net/MErPk/

于 2012-12-06T14:57:55.837 に答える
2

回答が編集されました CSS3 では、 nth-childセレクター を使用できます。この例は、rowIndex = 2 を示しています。

 alert(document.querySelector("table tr:nth-child(2)").id);

jQueryでは、これを行うことができます

 alert($("table tr:nth-child(2)").attr('id'));

同じ構文nth-child()を CSS で使用できます

<style>
    tr:nth-child(2) {
        color: red;
    }
</style>
于 2012-12-06T15:04:24.563 に答える