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

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

在其父元素中查找元素索引的泛型代码 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]);

你可以用 Array.prototype.indexOf.call() 这样地

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

你可以用 Array.prototype.indexOf.call() 这样地

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

NodeList对象是一个类似数组的对象。所以可以使用 Array.prototype.slice.call()

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

在支持ES6的浏览器上,也可以使用 Array.from()

const arr = Array.from(yourNodeListObject);

或者使用 spread operator ...

const arr = [...yourNodeListObject];

假设您有以下行:

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

列表将是节点列表。

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

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

只需在脚本中添加一行:

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

然后使用 索引

var index = NodeList.indexOf(NodeElement);