javascript - 获取 zindex javascript chrome

Question

谁能告诉我如何在 Google chrome 中找到 div 的 zindex？

document.getElementById(id).style.zIndex; //does not work

Answer 1

使用 jQuery。

$('#id').css( 'zIndex' )

Answer 2

这是一种标准的跨浏览器表示法，适用于我的 Chrome 版本。在继续之前，我会检查以确保您的 JavaScript 的每个部分都返回您期望的内容：

alert(document.getElementById(id)); // should return an [object HTMLElement]
alert(document.getElementById(id).style); // should return an [object CSSStyleDeclaration]
alert(document.getElementById(id).style.zIndex); // should return blank (default) or a number

另外，你怎么知道它已经设置好了？它可以是继承或自动...（这意味着它没有为该元素显式声明）。

此外，请确保在元素在 DOM 中可用之后运行它。

Answer 3

由于 z index 在 CSS 部分中提到，您将无法直接通过您提到的代码获取它。您可以使用以下示例。

function getStyle(el,styleProp)
{
    var x = document.getElementById(el);

    if (window.getComputedStyle)
    {
        var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp); 
    }  
    else if (x.currentStyle)
    {
        var y = x.currentStyle[styleProp];
    }                     

    return y;
}

传递您的元素 id 和样式属性以获取该函数。

例如：

var zInd = getStyle ( "normaldiv1" , "zIndex" );
alert ( zInd );

对于 Firefox，您必须通过 z-index 而不是 zIndex

var zInd = getStyle ( "normaldiv1" , "z-index" );
 alert ( zInd );