javascript - 如何获得多个具有相同名称的 div 的最高 z-index 值？

Question

可能重复：
选择具有最高 z-index 的 DIV

如何获得最高的 z-index 值？
将所有 div z-index 值放入数组并使用 math.max？或任何建议？

<div class="a" z-index="1">
<div class="a" z-index="3">
<div class="a" z-index="4">
<div class="a" z-index="5">
<div class="a" z-index="6">
<div class="a" z-index="11">...

<div class="b" z-index="//top+1">

js

var top = // highest z-index value;

Answer 1

你可以这样做：

var zIndx = [];
$("div.a").each(function() {
    zIndx.push( $(this).attr("z-index") );
});
console.log( Math.max.apply( Math, zIndx ) );

Answer 2

JavaScriptArray.reduce可以完成这项工作。 .get可以为您提供所需的数组：

var top = $(".a").get().reduce(function (a, b) {
   return Math.max(typeof a === 'object' && $(a).attr('z-index') || a,
      $(b).attr('z-index'));
});

http://jsfiddle.net/8jpea/1/

顺便说一句，使用自己的自定义属性时要小心。可以的话就去吧data-z-index。

Answer 3

var maxValue = Math.max.apply( Math, $('.a').map(function() {
    return +$.attr(this, 'z-index');
}));

这是小提琴：http: //jsfiddle.net/ZFhzu/

---

如果您使用的是现代 JavaScript，则不需要花哨apply的 . 您可以改为传播值：

let maxValue = Math.max(...$('.a').get().map(el => +$.attr(el, 'z-index')));

Here's the fiddle: http://jsfiddle.net/7y3sxgbk/

Answer 4

这是您可以使用的功能。

var index_highest = 0;   

// more effective to have a class for the div you want to search and 
// pass that to your selector

$(".a").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;
          }
});

console.log(index_highest);

Answer 5

    var top = 0;
    $('.a').each(function(){
        if(top < parseInt($(this).attr('z-index'))){
            top= parseInt($(this).attr('z-index'));
        }
    });
    $('.b').attr('z-index',top+1);

jsfiddle.net/EC36x