將css類添加到列表項（jQuery中的最后一個除外）

Question

我有一個無序列表，這些值是使用php和mysql從數據庫生成的。

<div id="articles">
    <ul>
        <?php foreach ($articles as article) { ?>
            <li><a href="/articles/<?php echo $article['name']; ?>"> <?php echo $article['name']; ?> </a> </li>
        <?php } ?>
    </ul>
</div>

我想使用jQuery向該列表中的每個項目（最后一個項目除外）添加一個CSS類

Answer 1

 //then you can select all `li` elements under `#articles` except the last one like jQuery(function($) { $('#articles li:not(:last)').addClass('myclass') }) 

 .myclass { background-color: lightgrey; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="articles"> <ul> <li><a href="/articles/1">1</a></li> <li><a href="/articles/2">2</a></li> <li><a href="/articles/3">3</a></li> </ul> </div> 

---

您只能使用CSS來做

 #articles li { background-color: lightgrey; } #articles li:last-child { background-color: white; } 

 <div id="articles"> <ul> <li><a href="/articles/1">1</a></li> <li><a href="/articles/2">2</a></li> <li><a href="/articles/3">3</a></li> </ul> </div> 

Answer 2

<div id="articles">
<ul>
    <?php 
         $count =count($articles);
         foreach ($articles as article) {
           $counter++;
            If($count==$counter)
                 $class='something';
             Else
                 $class='';
 ?>
               <li><a href="/articles/<?php echo     $article['name']; ?>"> <?php echo $article['name']; ?>     </a> </li>
        <?php
             }
         ?>
</ul>
</div>

現在在li中使用class變量。

Answer 3

您還可以通過在代碼中添加一個條件來使用PHP實現相同的目的。

foreach ($articles as $article) {
    if(end($articles) == $article) {
    ?>
       <li><a href="/articles/<?php echo $article['name']; ?>"> <?php echo $article['name']; ?> </a></li>
    <?php
    }
    else{ ?>
       <li class="myclass"><a href="/articles/<?php echo $article['name']; ?>"> <?php echo $article['name']; ?> </a></li>
   <?php
      }
}