jQuery- 모든 마지막 목록 항목에 클래스를 추가하는 방법?

StackOverflow https://stackoverflow.com/questions/563740

  •  05-09-2019
  •  | 
  •  

문제

여기에 작동하지 않는 코드가 있습니다.

$("#sidebar ul li:last").each(function(){
      $(this).addClass("last");
});

기본적으로 나는 3 개의 목록이 있으며 각각의 비 지정 목록에 마지막으로 나타나는 각 항목에 클래스 (마지막)를 추가하려고합니다.

<ul>
      <li>Item 1</li>
      <li>Item 2</li>
      <li class="last">Item 3</li>
</ul>

그것이 말이되기를 바랍니다, 건배!

도움이 되었습니까?

해결책

쉬운 실수. 이 시도:

$("#sidebar ul li:last-child").addClass("last");

기본적으로 : 마지막은 당신이 생각하는 것을 제대로하지 않습니다. 각 목록의 마지막이 아니라 문서의 마지막과 일치합니다. 그게 바로 다음과 같습니다. 마지막 자식은입니다.

다른 팁

jQuery와 함께 이것을 추가하십시오

$("ul li").last().addClass('last');

작동하지 않는 이유는 :last 하나의 요소 만 일치합니다. jQuery 문서에서 :

마지막으로 선택한 요소와 일치합니다.

그래서 코드가하는 일은 모든 세트를 얻는 것입니다. <li> 요소의 요소 <ul> 그리고 그 세트에서 마지막 값을 취합니다. 예시:

 <ul>
   <li>1</li>
   <li>2</li>
 </ul>
 <ul>
   <li>3</li>
   <li>4</li>
 </ul>
 <ul>
   <li>5</li>
   <li>6</li>
 </ul>

코드가 요소를 반환합니다 <li>6</li>. (내부적으로 수집 할 것입니다 <li>1</li> 에게 <li>6</li> 그런 다음 마지막 것을 떼어 내고 반환하십시오).

당신이 찾고있는 것은 여기서 다른 답변이 말한 것입니다. :last-child.

또는 목록에 ID를 제공하고 jQuery-Call의 컨텍스트로 사용할 수 있습니다.

<ul id="myList">
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
</ul>

<ul id="anotherList">
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
</ul>

그리고 당신은 할 수 있습니다 :

jQuery("li:last", "ul#myList").addClass("lastItem");

이제 첫 번째 목록의 마지막 LI에는 "ostitem"클래스가 있습니다.

편집 : 죄송합니다. 질문을 잘못 읽었습니다. 이것을 무시하십시오.

3 개의 별도 목록에 클래스를 추가 해야하는 경우 클래스를 할당하고 '각각'을 사용할 수 있습니다.

$('#sidebar ul.class li:last-child').each(function(e){
    $(this).addClass("last");
});

이것은 예상대로 정확하게 작동해야합니다.

당신은 시도 할 수 있습니다

$('#sidebar ul li:last').addClass('last');
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top