如何使用jQuery查找最高的z-index

Question

我有许多具有不同z-index的div元素。我想在这些div中找到最高的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-index。

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

Answer 1

请注意，z-index仅影响定位的元素。因此，position: static即使您为其分配了值，带有的任何元素也不会具有z-
index。在诸如Google Chrome之类的浏览器中尤其如此。

var index_highest = 0;   
// more effective to have a class for the div you want to search and 
// pass that to your selector
$("#layer-1,#layer-2,#layer-3,#layer-4").each(function() {
    // always use a radix when using parseInt
    var index_current = parseInt($(this).css("zIndex"), 10);
    if(index_current > index_highest) {
        index_highest = index_current;
    }
});

像这样的通用jQuery选择器与返回一个值的选项一起使用时，只会返回第一个值。因此，您的结果就是jQuery捕获的第一个div的z-
index。要仅获取所需的div，请在它们上使用一个类。如果需要所有div，请坚持使用div。