找到行索引的有效方法?

时间:2012-04-05 06:42:45

标签: javascript jquery html performance jquery-selectors

我通过这样做得到了一行的索引:

row.parent().children("tr").index(row)

是否有更有效的方法来查找索引?我有数百行,所以它会破坏我的性能,我必须选择所有行才能找到索引。

5 个答案:

答案 0 :(得分:5)

row.prevAll().length怎么样?

答案 1 :(得分:0)

<!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>

希望有所帮助。欢呼声。

答案 2 :(得分:0)

Id属性是解析任何html的最快方法。您可以为所有行提供Id。

虽然索引方法将确定兄弟元素之间的索引,这可能更快

row.parent("tr").index();

请参阅此示例http://jsfiddle.net/shNrS/

答案 3 :(得分:0)

如果您以某种方式获得对该行的引用(单击处理程序等),而不是在查找该元素时没有额外的开销,只需.index()它和利润(尽管注意多个tbody有效但会增加脚本复杂性的元素)

如果要在运行时为所有 tr元素编制索引,也可以将其缓存在jquery数据中以备将来使用!

答案 4 :(得分:0)

这里最快的方法可能是使用普通的javascript:

function getRowIndex(elem) {
    var index = 0;
    while (elem = elem.previousSibling) {
        if (elem.tagName == "TR") {
            ++index;
        }
    }
    return(index);
}    

工作演示:http://jsfiddle.net/jfriend00/y4anN/

如果必须在没有动态更改的大型表上重复执行此操作,那么您可以使用自定义属性对行进行一次预编号,从那时起,您只需要执行此操作即可检索来自任何一行的自定义属性。

您可以使用以下自定义属性对所有行进行预编号:

function numberRows(table) {
    var rows = table.getElementsByTagName("tr");
    for (var i = 0; i < rows.length; i++) {
        rows[i].dataIndex = i;
    }
}  

然后,你可以从任何给定的行中获取索引号,如下所示:

row.dataIndex

工作演示:http://jsfiddle.net/jfriend00/CR2Wk/