Question

有人可以告诉我如何为拥有height > 22px的元素添加css样式？

我做了一些东西，但css样式被添加到所有元素......

HTML：

<div class="left">
  <div class="row">
    word word word word word word word word word word word word
  </div>
  <div class="row">
    word word word word
  </div>
  <div class="row">
    word word word word word word word word word word word word word word word word     word word word word
  </div>
</div>

<div class="right">
  <div class="row">
    word word word word word word word word word word word word
  </div>
  <div class="row">
    word word word word
  </div>
  <div class="row">
    word word word word word word word word word word word word word word word word     word word word word
  </div>
</div>

JS：

if ($('.row').height() > 22) {
    $('.row').css({'background-color':'blue'})
}

Answer 1

您需要在此处使用 filter 功能：

将匹配元素集合减少到与选择器匹配的元素或通过函数测试。

＆＃13;

$(function(){
 $('.row').filter(function(){
   return $(this).height() > 22;
 }).css({'background-color':'blue'});
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div class="left">
  <div class="row">
    word word word word word word word word word word word word
  </div>
  <div class="row">
    word word word word
  </div>
  <div class="row">
    word word word word word word word word word word word word word word word word     word word word word
  </div>
</div>

<div class="right">
  <div class="row">
    word word word word word word word word word word word word
  </div>
  <div class="row">
    word word word word
  </div>
  <div class="row">
    word word word word word word word word word word word word word word word word     word word word word
  </div>
</div>

＆＃13;

Answer 2

使用.each（）方法指定为每个匹配的元素运行。

$(".row").each(function() {
  if ($(this).height() > 22) {
    $(this).css({
      'background-color': 'blue'
    })
  }
});

<强> Working example

如何使用jQuery仅向某些元素添加css样式

2 个答案: