JQUERY의 속성 선택기와 사용자 정의 선택기를 사용하는 방법(2)_jquery

예: "wangorg" 문자가 포함된 굵은 링크 텍스트
css:

코드 복사 코드는 다음과 같습니다.

.abold{
font-weight:bold;
}

html:

코드 복사 코드는 다음과 같습니다.

$('document').ready(function(){

$('a[href* =wangorg]').addClass('abold');
})

속성 선택도 결합할 수 있습니다:
$('a[href^=http]
[href*=wangorg]').addClass('abold')

사용자 정의 선택기는 JQUERY에 의해 추가된 고유하고 완전히 다른 선택기입니다. 구문은 CSS의 의사 클래스 선택기 구문과 동일합니다. 즉, 선택기는 콜론(:)으로 시작합니다.
예: wangorg 클래스와 일치하는 div 컬렉션에서 두 번째 항목을 선택합니다. 해당 구문은 $('div.wangor:eq(1)')입니다.
CSS 선택기 구문은 $('div: nth-child(2)')
예: 테이블 짝수 행의 배경색을 #ccc로 변경
CSS:

코드 복사 코드는 다음과 같습니다:

.alt{
backgroud-color:#ccc;
}

HTML :

코드 복사 코드는 다음과 같습니다.

$('document').ready (function() {

$('tr:odd').addClass('alt')
})

웹 페이지의 모든 테이블을 위와 같이 변경합니다. 효과:

코드 복사 코드는 다음과 같습니다:

$('document'). Ready(function(){
$('tr:nth-child(even)').addClass('alt');
})

테이블 글꼴 추가 Thick

코드 복사 테이블에 "wangorg" 문자열이 포함되어 있습니다. 코드는 다음과 같습니다.

$('document').ready(function( ){
$('tr:contains(wangorg)').addClass('abold');
})

관련 선택기 설명:
:eq(index )
주어진 인덱스 이후(보다 큰) 결과 집합의 요소(0부터 시작)
:odd
결과의 모든 홀수 요소 set(0부터 시작)
:even 결과 집합의 모든 짝수 요소(0부터 시작)
:nth-child(even)
상위 요소의 짝수 번째 하위 요소인 요소 (1부터 계산)
:contains(text) 주어진 텍스트를 포함하는 요소 text .