jquery - 查找具有 css 属性值 jquery 的元素的位置

Question

如何使用 css 属性值 jquery 查找元素的位置

<ul>
    <li style="z-index:8">aa</li>
    <li style="z-index:4">bb</li>
    <li style="z-index:7">cc</li>
</ul>

那么我怎样才能找到元素的位置z-index : 4

Answer 1

这取决于您所说的“位置”是什么意思，但如果它是其兄弟姐妹中的位置，我建议：

var index = $('li').filter(function(){
    return $(this).css('z-index') == '4';
}).index();

而如果它是页面上的位置：

var position = $('li').filter(function(){
    return $(this).css('z-index') == '4';
}).position(),
    xCoord = position.left,
    yCoord = position.top;

或相对于其偏移父级的位置：

var offset = $('li').filter(function(){
    return $(this).css('z-index') == '4';
}).offset(),
    xCoord = offset.left,
    yCoord = offset.top;

请记住，我说得晚了，auto要从属性声明中获取非值z-index，您必须将position属性设置为（默认）以外的另一个值static（relative例如，或absolute）。

参考：

• filter().
• index().
• offset().
• position().

Answer 2

像这样试试

$("li").each(function(){
      if($(this).css('z-index') == "4") {
          alert("The index is " + $(this).index());
      }
}); 

您还可以将 positon 用于左侧和顶部位置，例如

var lft = $(this).position().left;
var rght = $(this).position().top;