获取列表中的第一个 DOM 元素

Question

我有一个 DOM 元素数组，不是按 DOM 顺序排列的。如何获得第一个，即 DOM 中第一个出现的那个？

如果 jQuery 能在这里提供帮助就更好了。

谢谢

Answer 1

既然你说 visual 顺序（而不是 DOM 顺序）就足够了，你可以这样做：

var first, firstTop, firstLeft;
$.each(yourArray, function(index, element) {
    var pos = $(element).offset();
    if (!first ||
        (pos.top < firstTop) ||
        (pos.top === firstTop && pos.left < firstLeft)
       ) {
        first = element;
        firstTop = pos.top;
        firstLeft = pos.left;
    }
});

---

也就是说，我不认为在 DOM 上进行递归下降并在找到的第一个元素处停止确实与您从评论中认为的工作量一样多，尤其是。因为您只对表单中的元素感兴趣。大致如下：

function getFirstInDOM(list, root) {
    var node, found;
    for (node = root.firstChild; node; node = node.nextSibling) {
        // I assume you only care about elements, so skipping other nodes
        if (node.nodeType === 1) {
            if (list.indexOf(node) !== -1) {
                // Found
                return node;
            }
            found = getFirstInDOM(list, node);
            if (found) {
                return found;
            }
        }
    }
    return null;
}

Live Example | Live Source

Answer 2

发现这个stackoverflow answer 声明当您使用 jQuery 添加两个元素时，它们将按文档顺序结束。

所以基本上我们可以只做 $().add(elementList).eq(0)。