Как найти самый высокий z-индекс, используя jQuery

Question

У меня есть несколько элементов div с различным z-index.И я хочу найти самый высокий z-индекс среди этих элементов - как я могу этого достичь?

CSS:

#layer-1 { z-index: 1 }
#layer-2 { z-index: 2 }
#layer-3 { z-index: 3 }
#layer-4 { z-index: 4 }

HTML:

<div id="layer-1">layer-1</div>
<div id="layer-2">layer-2</div>
<div id="layer-3">layer-3</div>
<div id="layer-4">layer-4</div>

НадеюсьНе думаю, что эта строка может найти самый высокий z-индекс.

var index_highest = parseInt($("div").css("zIndex"));
// returns 10000

Answer 1

Vanilla JS, не 100% кросс-браузер.В том числе в качестве справки для будущих читателей / альтернативный метод.

function getHighIndex (selector) {
    // No granularity by default; look at everything
    if (!selector) { selector = '*' };

    var elements = document.querySelectorAll(selector) ||
                   oXmlDom.documentElement.selectNodes(selector),
        i = 0,
        e, s,
        max = elements.length,
        found = [];

    for (; i < max; i += 1) {
        e = window.getComputedStyle(elements[i], null).zIndex || elements[i].currentStyle.zIndex;
        s = window.getComputedStyle(elements[i], null).position || elements[i].currentStyle.position;

        // Statically positioned elements are not affected by zIndex
        if (e && s !== "static") {
          found.push(parseInt(e, 10));
        }
    }

    return found.length ? Math.max.apply(null, found) : 0;
}