如何根据其他元素

Question

Fiddle为您提供了想法

<div class="change" style="width:150px;">xyz</div>
<div class="change" style="width:350px;z-index:999">XYZ</div>

我有两个相同类的div，其中内联css不同，我想在1st div中添加一个元素z-index作为z-index：99，而不是直接将它添加到内联css而不能添加新类因为我对它们没有任何控制，因为我得到的两个div都是通过jquery而不能从我的结尾编辑

基于该特定类的内联css宽度，我可以通过jquery或任何其他更好的解决方案添加新的inline-css元素吗？

提前致谢

Answer 1

第一个

jQuery('.change').first().css('z-index',1000);

或

jQuery('.change:first-child').css('z-index',1000);

最后一个

jQuery('.change').last().css('z-index',1000);

为第n个孩子

jQuery( ".change:nth-child(n)").css('z-index',1000);

https://api.jquery.com/category/selectors/child-filter-selectors/

Answer 2

在head

中的<style> </style>下面的css非常简单..add

.change:first-child{
  z-index:99;
}

Answer 3

你可以使用jquery

var w = $('.change:first').width();
$('.change:last').css('width', w + 'px');

Answer 4

请使用此：

$(".change").each(function(){
    if($(this).css("width") == "150px"){
    $(this).css("z-index",99);
  }
});

Answer 5

您可以使用纯CSS定位精确的内联属性：

.change[style*='width:150px'] { z-index:99; }

与属性一样具体，如果它发生变化，这将会破坏。如果它与另一个元素匹配，它也将在那里应用样式。

Answer 6

然后，您可以使用change类：

按项目的宽度进行过滤

```

$( ".change" ).filter(function( index ) {
    return $(this).width() === 150;
}).css( "z-index", 99 );

```