Notice
Recent Posts
Recent Comments
Link
SeouliteLab
jQuery를 사용한 목록의 뒤에서 두 번째 유형 요소에 새로운 내용 추가하기 본문
아래는 jQuery를 사용하여 목록(<ul>
)의 뒤에서 두 번째 유형 요소(<li>
)에 새로운 내용(<span> - 뒤에서 두 번째!</span>
)을 추가하는 예제입니다.
$( "ul li:nth-last-of-type(2)" ).append( "<span> - 뒤에서 두 번째!</span>" );
설명:
$()
함수를 사용하여 jQuery 선택자를 지정합니다."ul li:nth-last-of-type(2)"
는 ul 요소 아래의 뒤에서 두 번째 유형의 li 요소를 선택합니다.append()
함수를 사용하여 선택된 li 요소에 새로운 내용인<span> - 뒤에서 두 번째!</span>
을 추가합니다.
예제 2: 목록의 뒤에서 두 번째 유형 요소에 아이콘 추가하기
$( "ul li:nth-last-of-type(2)" ).append( "<i class='fa fa-check'></i>" );
설명:
이 예제는 ul 요소 아래의 뒤에서 두 번째 유형의 li 요소에 체크 아이콘을 추가합니다.
예제 3: 각 ul 요소의 뒤에서 두 번째 유형 요소에 스타일 변경하기
$( "ul li:nth-last-of-type(2)" ).css( "font-weight", "bold" );
설명:
이 예제는 각 ul 요소의 뒤에서 두 번째 유형의 li 요소의 글꼴을 굵게 변경합니다.