본문 바로가기
2019/jQuery

jQuery 위치관련 필터 선택자(index)

by SOLYI 2019. 12. 10.

  •  
  • eq(n) : n번째에 위치하는 문서 객체를 선택
  • not(선택자) : 선택자와 일치하지않는 문서 객체 선택
1
2
3
4
5
// eq(n) div n번째에 css를 적용시킴
$('div:eq(1)').css('background-color','yellow');
// not(.a)  - 클래스 a 가 아닌 div에 적용 
$('div:not(.a)').css('background-color','darkgreen');
 
 

 

  • contains(문자열) : 문자열이 포함되는 td에 css 적용
1
2
let data=$('td:contains("최솔이")')
    .css('border','1px solid silver');
  • nth-child (index even odd)
    • index 예를들어 3n+1
    • even 짝수
    • odd 홀수 
1
2
3
4
5
6
7
8
9
10
11
let n1=$('tr:nth-child(even)').css('color','green');
console.log(n1);
//even 2468 짝수..
 
let n2=$('tbody>tr:nth-child(odd)').css('background-color','darkgreen');
console.log(n2);
//odd 1357 홀수..
 
let n3=$('tbody>tr:nth-child(3n+1)').css('background-color','pink');
console.log(n3);
//1 4 7 10..
 
반응형

'2019 > jQuery' 카테고리의 다른 글

/// jQuery 3개 메서드체인, 객체,콜백함수  (0) 2019.12.11
jQuery find와 filter  (0) 2019.12.11
jQuery 속성 선택자(attribute)  (0) 2019.12.10
jQuery id/class별 css 설정 방법  (0) 2019.12.10
jQuery 사용 방법  (0) 2019.12.10