如何在javascript中获取元素的索引?

时间:2010-09-23 15:35:24

标签: javascript

NodeList没有indexOf(element)方法?那么,我怎样才能获得元素索引?

5 个答案:

答案 0 :(得分:37)

您可以像这样使用Array.prototype.indexOf.call()

let nodes = document.getElementsByTagName('*');
Array.prototype.indexOf.call(nodes, document.body);

答案 1 :(得分:10)

NodeList对象是类似于Array的对象。因此可以将其“转换”为数组。

也许它可以成为您的解决方案。

var arr = Array.prototype.slice.call(yourNodeListObject); // Now it's an Array.
arr.indexOf(element); // The index of your element :)

答案 2 :(得分:5)

迭代元素,并检查它是否匹配。

通用代码,用于查找其父级childNodes集合中元素的索引。

function index(el) {
    var children = el.parentNode.childNodes,
        i = 0;
    for (; i < children.length; i++) {
        if (children[i] == el) {
            return i;
        }
    }
    return -1;
}

用法:

// should return 4
var idx = index(document.body.childNodes[4]);
编辑:我无法删除已接受的答案,但@ kennebec在下面的答案要好得多,我将逐字引用:

  

您可以像这样使用Array.prototype.indexOf.call()

let nodes = document.getElementsByTagName('*');
Array.prototype.indexOf.call(nodes, document.body);

答案 3 :(得分:1)

让我们说您有以下一行:

const list=document.querySelectAll('.some_class .someother_class');

list将是一个节点列表。 因此,我们可以将节点列表转换为数组并创建一个新的索引数组,如下所示:

const indexArr= [...list].map( element => return [...list].indexOf(element) );

indexArr包含原始列表中元素的所有索引。

答案 4 :(得分:-1)

只需在脚本中添加一行:

NodeList.prototype.indexOf = Array.prototype.indexOf;   // for IE11

然后照常使用 indexOf

var index = NodeList.indexOf(NodeElement);