Question

如何通过jQuery找到元素的z-index值？

即：我有2个div，两个都是绝对的，z-index分别为10,1000。

但不幸的是，IE6显示第二个div，其中z-index 1000低于第一个。

所以我想在IE6中检查运行时第二个和第一个的z-index值。

请帮忙。

Answer 1

您可以使用css来获取它。

$("#your-div").css("z-index");

参考：http://api.jquery.com/css/

Answer 2

如果他们有ID（例如，您可以找到任何选择器），请使用.css()，如下所示：

var zIndex = $("#div1").css('z-index');

或者更完整：

alert("Div 1 zIndex: " + $("#div1").css('z-index'));
alert("Div 2 zIndex: " + $("#div2").css('z-index'));

Answer 3

与css()功能类似吗？

alert($('#my_object_id').css('zIndex'));

Answer 4

您可以使用$('selector').zIndex()。

请勿使用$('selector').css('z-index')。它只会告诉你在样式表中设置了什么（如果有的话）。它可能只是说＆＃34; auto＆＃34;。

Answer 5

jQuery提供了直接设置和获取任何元素的z-index的方法

语法：

var index = $("#div1").zIndex()

Answer 6

$(elem).css('z-index');

此外，您在哪里设置z索引。如果它是内联样式而不是样式块，那么您可能会看到不同的结果。所以：

<div style="z-index: 1000">..</div>

vs

<style>
div {
    z-index: 1000;
}
</style>

可能会给出不同的结果。另外，请记住，按照你的逻辑进行操作是徒劳的。

Answer 7

像

这样的东西

var zindex = $("#id").css("z-index");

Answer 8

使用zIndex而不是z-index。

$（ '选择'）的CSS（ 'zIndex的'）;

Answer 9

您的代码必须被破坏。选中 it works 。

如果您未设置z-index值 FF 且 Chrome 将显示auto和 IE 0。

Undefined表示您的代码中存在错误。

Answer 10

除了使用

$('selector').css('z-index')

您必须将样式中的postion:absolute或position:relative添加到您想要获得的z-index元素中。

Answer 11

我做了一个简单的递归函数，以获取确切的数字zIndex值

function getRecursiveParentZIndex(jqThis) {
  try {
    let thisTagName = jqThis.prop('tagName');

    let thisZIndex = jqThis.css('z-index');
    if (thisZIndex == '' || thisZIndex == 'auto') {
      thisZIndex = 0;
      if (thisTagName != 'HTML') {
        let newZIndex = getRecursiveParentZIndex(jqThis.parent());
        thisZIndex = newZIndex;
      }
    }

    return +thisZIndex;
  } catch (error) {
    console.log('parent Z Index error', error);

    return 0;
  }
}

let correctZindex = getRecursiveParentZIndex(jQuery('.your-selector'));

这将以数字形式返回正确的z-index值。（请注意，我使用的是ES6语法）

使用jQuery查找z-index值

11 个答案: