javascript - zindex javascript クロムを取得する

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

また、それが設定されていることをどのように知っていますか？inherit または auto... の可能性があります (これは、その要素に対して明示的に宣言されていないことを意味します)。

また、要素が DOM で使用可能になった後に必ず実行してください。

Answer 3

z インデックスは 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 の場合、zIndex の代わりに z-index を渡す必要があります

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