blocks|key|987333|text|您可以使用css获取它。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|987334|$("#your-div").css("z-index");|code-block|syntax|javascript|987335|参考：http://api.jquery.com/css/|987336|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/css/^0|5|3|0|0|3|Q|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|X|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|Y|8|@]|D|@$9|Z|A|10|1|11]]|E|$]]|$1|M|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]]]

You can get it using <code>css</code>.

<pre><code>$("#your-div").css("z-index");
</code></pre>

Ref: <a href="http://api.jquery.com/css/" rel="noreferrer">http://api.jquery.com/css/</a>

blocks|key|1201844|text|您可以使用$('selector').zIndex()。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1201845|请勿使用$('selector').css('z-index')。它只会告诉你在样式表中设置了什么(如果有)。它可能只会说“自动”。|1201846|entityMap^0|5|M|0|4|S|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|H|3|-4|5|6|7|P|8|@]|D|@]|E|$]]]|I|$]]

You can use <code>$('selector').zIndex()</code>.

DO NOT USE <code>$('selector').css('z-index')</code>. It will only tell you what (if anything) was set in the style sheet. It may just say "auto".

blocks|key|1201662|text|例如，如果它们有If+(或者您可以通过任何选择器找到它们)，请使用.css()，如下所示：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1201663|var+zIndex+=+$("#div1").css('z-index');|code-block|syntax|javascript|1201664|或者更完整：|1201665|alert("Div+1+zIndex:+"+%2B+$("#div1").css('z-index'));
alert("Div+2+zIndex:+"+%2B+$("#div2").css('z-index'));|1201666|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/css/^0|X|6|X|6|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@$9|Z|A|10|1|11]]|E|$]]|$1|F|3|G|5|H|7|12|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|13|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|14|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|15|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]]]

If they have IDs for example (or any selector you can find them by) use <a href="http://api.jquery.com/css/" rel="nofollow noreferrer"><code>.css()</code></a>, like this:

<pre><code>var zIndex = $("#div1").css('z-index');
</code></pre>

Or the more complete:

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

blocks|key|987254|text|比如css()函数？|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|987255|alert($('#my_object_id').css('zIndex'));|code-block|syntax|javascript|987256|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/css/^0|2|5|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@$A|R|B|S|1|T]]|C|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|C|$G|H]]|$1|I|3|-4|5|6|7|V|8|@]|9|@]|C|$]]]|J|$K|$5|L|M|N|C|$O|P]]]]

Like the <a href="http://api.jquery.com/css/" rel="nofollow noreferrer">css()</a> function ?

<pre><code>alert($('#my_object_id').css('zIndex'));
</code></pre>

blocks|key|987479|text|jQuery提供了直接设置和获取任何元素的z-index的方法|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|987480|语法：|987481|var+index+=+$("#div1").zIndex()|code-block|syntax|javascript|987482|entityMap|0|LINK|mutability|MUTABLE|url|https://api.jqueryui.com/1.10/zIndex/#zIndex-zIndex^0|L|7|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@$A|T|B|U|1|V]]|C|$]]|$1|D|3|E|5|6|7|W|8|@]|9|@]|C|$]]|$1|F|3|G|5|H|7|X|8|@]|9|@]|C|$I|J]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|C|$]]]|L|$M|$5|N|O|P|C|$Q|R]]]]

jQuery provides methods to directly set and get <a href="https://api.jqueryui.com/1.10/zIndex/#zIndex-zIndex" rel="nofollow noreferrer">z-index</a> of any element

Syntax:

<pre><code>var index = $("#div1").zIndex()
</code></pre>

blocks|key|1201769|text|$(elem).css('z-index');|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1201770|另外，您将在何处设置z索引。如果它是在内联样式和样式块中，那么你可能会看到不同的结果。所以：|unstyled|1201771|<div+style="z-index:+1000">..</div>|1201772|vs|1201773|<style>
div+{
++++z-index:+1000;
}
</style>|1201774|可能会产生不同的结果。此外，请记住，在IE中遵循您的逻辑是徒劳的。|1201775|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|R|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$B|C]]|$1|I|3|J|5|F|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$B|C]]|$1|M|3|N|5|F|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|F|7|W|8|@]|9|@]|A|$]]]|P|$]]

<pre><code>$(elem).css('z-index');
</code></pre>

Also, where are you setting the z-indexes. If it's in an inline style vs a style block, then you may see different results. So:

<pre><code>&lt;div style="z-index: 1000"&gt;..&lt;/div&gt;
</code></pre>

vs 

<pre><code>&lt;style&gt;
div {
 z-index: 1000;
}
&lt;/style&gt;
</code></pre>

may give different results. Also, remember that going by your logic is an exercise in vain with IE.

blocks|key|987432|text|除了使用|type|unstyled|depth|inlineStyleRanges|entityRanges|data|987433|$('selector').css('z-index')|code-block|syntax|javascript|987434|你必须在你的样式中添加postion:absolute或position:relative到你想要得到的带有z索引的元素。|offset|length|style|CODE|987435|entityMap^0|0|0|B|G|S|H|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]|$I|T|J|U|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|N|$]]

Besides using 

<pre><code>$('selector').css('z-index')
</code></pre>

you have to add <code>postion:absolute</code> or <code>position:relative</code> in your styles to element with z-index you want to get.

blocks|key|1201698|text|像这样的东西怎么样|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1201699|var+zindex+=+$("#id").css("z-index");|code-block|syntax|javascript|1201700|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

what about something like

<pre><code>var zindex = $("#id").css("z-index");
</code></pre>

blocks|key|987367|text|使用索引而不是z-+zIndex。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|987368|$('selector').css('zIndex')；|987369|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

use zIndex instead of z-index.

$('selector').css('zIndex');

blocks|key|1201980|text|我做了一个简单的递归函数来获得准确的zIndex数值|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1201981|function+getRecursiveParentZIndex(jqThis)+{
++try+{
++++let+thisTagName+=+jqThis.prop('tagName');

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

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

++++return+0;
++}
}

let+correctZindex+=+getRecursiveParentZIndex(jQuery('.your-selector'));|code-block|syntax|javascript|1201982|这将在number中返回正确的z索引值。(请注意，我使用了ES6语法)|1201983|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

I made a simple recursive function to get the exact zIndex value in number
<pre><code>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'));
</code></pre>
This will return the correct z-index value in number.
(Note that i used ES6 syntax)

How to find a z-index value of a element by jQuery?

i.e.:
I have 2 divs, both are positioned absolute and z-index 10, 1000 respectively.

But unfortunately IE6 displaying second div which has z-index 1000 below the first one.

So I want to check what the z-index value of second one and first one at run time in IE6.

Please help.

Finding z-index value using jQuery

jQuery

如何通过jQuery找到元素的z索引值？例如:我有两个div，它们分别位于绝对和z索引10,1000。但不幸的是，IE6显示了第二个div，它的z索引比第一个低1000。所以我想在IE6中检查第二个和第一个在运行时的z索引值。请帮帮忙。

问使用jQuery查找z索引值
EN

回答 10

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用jQuery查找z索引值EN

回答 10

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用jQuery查找z索引值
EN