//위치 선택자
$('ol>li:first').css('color', 'red'); //li중에 첫번쨰 객체 선택
$('ol>li:last').css('color', 'blue'); //li중에 마지막번 객체 선택
$('ol>li:even').css('background-color', 'pink'); //index --> 0번쨰 부터
$('ol>li:odd').css('vackground-color', 'lightblue'); //index --> 0번쨰부터
//마지막에서 순서대로 선택
//nth-last-of-type(): 마지막에서 순서대로 선택
$('ol>li:nth-last-of-type(3)').css('color', 'green');
$('ol>li:nth-child(3n)').css('border-bottom', '2px solid red'); //1번쨰 부터
//slice() : index위치에서 끝까지 객체 선택
$('ol>li').slice(3).css('font-size', '3em');
//eq() : index 위치의 객체 선택
$('ol>li').eq(3).css('color', 'red');
//:lt() : index 위치보다 작은 위치 선택
$('ol>li:lt(4)').css('font-family', '궁서체');
//:gt() : index 위치보다 큰 위치 선택
$('ol>li:gt(4)').css('color', 'cyan');
//부모객체 중에서 자손이 1개인 객체 선택
$('li:only-child').css("background-color", "yellow").css("border", '2px solid red');
'WEB > Jquery' 카테고리의 다른 글
[jquery] 수치조작메소드 (0) | 2021.03.10 |
---|---|
[jquery] 클래스 추가시키기 (0) | 2021.03.10 |
[Jquery] 상태선택자 (0) | 2021.03.10 |
[JQuery] 속성선택자 (0) | 2021.03.10 |
최근댓글