Question

我有一个具有相同类的元素的列表，我想检查在同一父元素下是否具有内容。如果没有内容，请添加一个类

因此，因为它是同一个类，所以我需要为每个元素运行该函数，并且一旦选中，就添加或不添加该类，并继续检查其他元素

无论我尝试什么，我都无法使其工作

$(document).ready(function() {
  $(".description").each(function() {
    if ($.trim($(this).text()).length == 0) {
      $('.title').addClass('emptyDesc');
    }
  });
});

.emptyDesc{
  background: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>
    <span class="title">TITLE</span>
    <span class="description"></span>
    <!-- Check whether it has description or not. If not, add class -->
  </li>

  <li>
    <span class="title">TITLE</span>
    <span class="description">DESCRIPTION</span>
    <!-- Check whether it has description or not. If not, add class -->
  </li>

  <li>
    <span class="title">TITLE</span>
    <span class="description"></span>
    <!-- Check whether it has description or not. If not, add class -->
  </li>
  <ul>

Answer 1

您要在第4行的每个标题中添加emptyDesc。您必须像这样获得最接近的标题：

$(document).ready(function() {
  $(".description").each(function() {
    if ($.trim($(this).text()).length == 0) {
      $(this).siblings('.title').addClass('emptyDesc');
    }
  });
});

.emptyDesc{
  background: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>
    <span class="title">TITLE</span>
    <span class="description"></span>
    <!-- Check whether it has description or not. If not, add class -->
  </li>

  <li>
    <span class="title">TITLE</span>
    <span class="description">DESCRIPTION</span>
    <!-- Check whether it has description or not. If not, add class -->
  </li>

  <li>
    <span class="title">TITLE</span>
    <span class="description"></span>
    <!-- Check whether it has description or not. If not, add class -->
  </li>
  <ul>

Answer 2

找到同级，然后添加课程

 <script>
        $( document ).ready(function() {
        $( ".description" ).each(function() {
            if ( $.trim( $(this).text() ).length == 0 ) {
               $(this).siblings('.title').addClass('emptyDesc');
            }
            });
        });
      </script>

Answer 3

尝试一下...

$(document).ready(function(){
  $('li>span').each(function(){
    if($(this).is(':empty')){
      $(this).prev().addClass('emptyDesc');
    }
  });
});

.emptyDesc {
  background-color:yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li>
        <span class="title">TITLE</span>
        <span class="description"></span>  <!-- Check whether it has description or not. If not, add class -->
    </li>

    <li>
        <span class="title">TITLE</span>
        <span class="description">DESCRIPTION</span>  <!-- Check whether it has description or not. If not, add class -->
    </li>

    <li>
        <span class="title">TITLE</span>
        <span class="description"></span>  <!-- Check whether it has description or not. If not, add class -->
    </li>
<ul>

为具有相同类的每个元素运行一个函数

3 个答案: