Uzyskiwanie z-indeksu DIV w JavaScript?

Question

Mam div normaldiv1 z klasą normaldiv. Próbuję uzyskać dostęp do jego indeksu z poprzez właściwość stylu, ale zawsze zwraca 0, chociaż jest ustawiony na 2 w arkuszu stylów.

CSS:

.normaldiv 
{ 
    width:120px; 
    height:50px; 
    background-color:Green; 
    position: absolute; 
    left: 25px; 
    top:20px; 
    display:block; 
    z-index:2; 
} 

`

HTML:

<div id="normaldiv1" 
    class="normaldiv" 
    newtag="new" 
    tagtype="normaldiv1" 
    onmousedown="DivMouseDown(this.id);" 
    ondblclick="EditCollabobaTag(this.id,1);" 
    onclick="GetCollabobaTagMenu(this.id);" 
    onblur="RemoveCollabobaTagMenu(this.id);"> 

JavaScript:

alert(document.getElementById('normaldiv1').style.zIndex); 

Jak mogę znaleźć z-index elementu przy użyciu JavaScript?

Answer 1

Ponieważ indeks z jest wymieniony w części CSS, nie będzie można uzyskać go bezpośrednio przez wspomniany kod. Możesz użyć następującego przykładu.

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; 
} 

przekazać identyfikator elementu i styl elementu, aby uzyskać dostęp do funkcji.

Np

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

do Firefoksa trzeba przejść z-index zamiast zindex

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

Reference

Answer 2

spróbować tej

window.getZIndex = function (e) {  
    var z = window.document.defaultView.getComputedStyle(e).getPropertyValue('z-index'); 
    if (isNaN(z)) return window.getZIndex(e.parentNode); 
    return z; 
}; 

Wykorzystanie

var myZIndex = window.getZIndex($('#myelementid')[0]); 

(jeśli rodzic dostaje do wykorzenienia powróci 0)