Resources/Web

[jQuery] CSS Selector 정리

gilbird 2010. 2. 25. 11:32

기본 찾기 selector

  • img
    • <img 엘리먼트 선택
  • #myid
    • myid라는 아이디 선택
  • .myclass
    • myclass라는 클래스 선택
  • img#myid.myclass
    • img 엘리먼트의 아이디가 myid인 myclass 선택
  • div img.myclass
    • div 밑의 img엘리먼트 중에서 myclass인 것들 선텍
  • div > img
    • div 바로 밑 자식 중 img 엘리먼트 선택
  • div + img
    • div 바로 다음 img가 나온 모든 엘리먼트
  • div ~ img
    • div 다음 sibling으로 img가 나온 모든 엘리먼트
  • a[href^=http://]
    • a 엘리먼트의 href 속성이 http://로 시작하는 것들
  • img[src]
    • img 엘리먼트에 src 속성이 있는 것들
  • a[href$=.pdf]
    • a 엘리먼트 링크가 .pdf로 끝나는 것들
  • a[href*=.com]
    • a 엘리먼트에 .com 링크가 있는 것들

위치로 선택 selector

  • :first
  • :last
  • :first-child
  • :last-child
  • :only-child
  • :nth-child(n)
  • :nth-child(event|odd)
  • :nth-child(Xn+Y)
  • :even|odd
  • :eq(n)
  • :gt(n)
  • :lt(n)

jQuery 커스텀 필터 selector

  • :animated
  • :button
  • :checkbox
  • :checked
  • :contains(foo)
  • :disabled|enabled
  • :file
  • :header
  • :hidden
  • :image
  • :input
  • :not(filter) – 필터만 들어감에 유의할 것
  • :parent
  • :password
  • :radio
  • :reset
  • :selected
  • :submit
  • :text
  • :visible