これを行うことで行のインデックスを取得しています:
row.parent().children("tr").index(row)
インデックスを見つけるためのより効率的な方法はありますか?何百もの行があるので、インデックスを見つけるためだけにすべての行を選択する必要があるので、パフォーマンスが低下します。
これを行うことで行のインデックスを取得しています:
row.parent().children("tr").index(row)
インデックスを見つけるためのより効率的な方法はありますか?何百もの行があるので、インデックスを見つけるためだけにすべての行を選択する必要があるので、パフォーマンスが低下します。
どうrow.prevAll().length
ですか?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" charset="utf-8" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
console.log($("tr").index($("#my")));
})
</script>
</head>
<body>
<table border="0" cellspacing="5" cellpadding="5" id="tbl">
<tr><th>Header</th></tr>
<tr><td>Data</td></tr>
<tr id="my"><th>Header</th></tr>
<tr><th>Header</th></tr>
<tr><td>Data</td></tr>
</table>
</body>
</html>
それが役立つことを願っています。乾杯。
Id 属性は、HTML を解析する最も高速な方法です。すべての行に ID を指定できます。
index メソッドは兄弟要素間のインデックスを決定しますが、これはより高速になる可能性があります
row.parent("tr").index();
この例を参照してくださいhttp://jsfiddle.net/shNrS/
何らかの方法で行への参照を取得している場合 (クリック ハンドラーなど)、その要素を検索する際に追加のオーバーヘッドがなく、それだけ.index()
で利益が得られます (ただし、tbody
有効ではあるがスクリプトが複雑になる複数の要素に注意してください)。
実行時にすべての 要素にインデックスを付ける場合はtr
、将来の使用のために jquery データにキャッシュすることもできます。
ここで最速の方法は、おそらくプレーンな JavaScript を使用することです。
function getRowIndex(elem) {
var index = 0;
while (elem = elem.previousSibling) {
if (elem.tagName == "TR") {
++index;
}
}
return(index);
}
実際のデモ: http://jsfiddle.net/jfriend00/y4anN/
動的に変更されていない大きなテーブルでこれを繰り返し実行する必要がある場合は、カスタム属性を使用して行に 1 回事前に番号を付けてから、カスタム属性を取得するだけで済みます。任意の行。
次のようなカスタム属性を使用して、すべての行に事前に番号を付けます。
function numberRows(table) {
var rows = table.getElementsByTagName("tr");
for (var i = 0; i < rows.length; i++) {
rows[i].dataIndex = i;
}
}
そして、次のように任意の行からインデックス番号を取得できます。
row.dataIndex