능숙 jQuery 선택기의 사용에 [이동]
jQuery, 완전한 선택기 구문을 제공, 우리는 거의 모든 요소를 선택할 수 있도록 선택의 매우 강력한 엔진이다. jQuery의 셀렉터 구문 CSS3과 XPath에 기초를 두는 및 CSS3과 XPath에 대한 더 많은 이해를 할 때 더 중요한 jQuery의 사용이 편리합니다. CSS를과 XPath, 다음 링크를 참조하시기 바랍니다 :
그것은, 오늘은 모든 브라우저에서 CSS3, 그래서 우리가 지원을 거의 사용되지 않은 눈길을 끌만한 내용이다. 맞춤 검색 엔진이있다 그러나 자체 jQuery 선택기 때문에, 우리는 여전히, CSS3 지원의 실현을 jQuery 사용 CSS3 요소를 선택할 수있습니다.
JQuery 선택기 자세한 내용을 알고, 공식 jQuery 관련 문서 선택기 부분을 방문하고 싶습니다. 지금, 공식 문서의 원본을 기준으로 몇 가지 간단한 번역과 설명을 확인하십시오.
1.는 CSS 셀렉터 (CSS를 선택기)
jQuery는 CSS 1월 3일에 대한 완벽한 지원을, 그리고 그것을 수있습니다 (선택) 사용자를 추가하는 CSS를 표현 - (과 XPath)처럼.
지원 1월 1일 jQuery는 CSS 셀렉터 구문
- * 모든 요소
- 요소의 모든 종류의 (사실의 이메일로 전자, 전자 어떠한 요소가 될 수 있음)
- 이메일 : 니은 번째 - 아이 (n)이 요소의 유형 전자, 그의 아버지는 첫 번째 요소는 하위 - n의 요소이다
- 이메일 : 요소의 첫 번째 유형의 E - 아이, 그의 아버지는 요소의 첫 번째 자식 요소의 E (동급 : 니은 번째 - 아이 (0))입니다
- 이메일 : 요소의 유형 E의 마지막 - 자녀, 그의 아버지 - 최종 요소의 하위 요소입니다
- 이메일 : 요소의 유형 E의 유일한 - 아이, 그것을 요소 요소의 하나 뿐인 아들의 아버지입니다
- 이메일 : 더 하위 - (텍스트 요소를 포함한 요소가 (UI)를 요소)은 사용자 인터페이스 유형 전자 빈
- 이메일 : 그것은 (장애인)을 금지로 설정됩니다 (UI)를 요소로, 사용자 인터페이스가 활성화된 유형 전자
- 이메일 : 이메일을 사용자 인터페이스의 장애 유형 (UI)를 요소로, 그것을 허용하도록 설정되어있습니다 () 활성화
- 이메일 : () 국영 라디오 버튼과 체크 박스 ()에 대한 검사를 선택합니다 (UI)를 요소로, 사용자 인터페이스 형식으로 이메일을 체크
- 이메일 : 사용자의 이메일을 입력 인터페이스 () 상태를 선택한 선택 (선택되어 (UI)를 요소로 선정, 거기에 하나 이상의 다른 요소)이다. 참고 : 선택한 속성은 CSS를 사양에서가 아니라 내부 지원 jQuery의 제공
- "myclass 요소의 유형 전자 E.myclass, 동급"
- 전자 #, 그 ID가 "myid"입니다 요소의 E 타입 myid
- 이메일 : (s의 유형 전자, 요소), 그리고 요소의 농도의 결과 () 선택기 포함되지 (필터링에 사용되는)과 일치하지 않습니다
- EF는 요소의 유형은 F, 그것은 이메일을 자손 요소에 대한 요소의 유형 (주 자손 요소)
- 전자> 요소의 F 유형에 F, 그것은 이메일을 하위 요소의 유형 - 요소 ()은 하위 - 요소 메모입니다
- 전자 + F를 요소의이 F 유형, 그것을 (참고 F 노드 전자의 오빠는 동생이 요소 뒤에 전자 요소의 종류에, 그리고 그 뒤를 이은 후속 밀접)
- 전자 ~ F 요소의이 F 유형, 그것을 (참고 F - E의 형제 노드, 및 E의 뒤쪽에 위치하는 형제 요소 뒤에 전자 요소의 종류)
- 전자로, F, G는 전자, 요소의 종류, 요소의 타입 F, G는 요소의 유형 (하나 이상의 요소를 선택하는 데 사용)
1월 2일 jQuery를 지원하지만, 구문 선택기에서 다른 CSS를 사양 ()이다
차이점은 속성의 이름을 상징하기 전에 "@"에 추가되어야합니다
- 전자 [foo는 @] 요소의 E 타입, "부동산"foo는있다
- 전자 [@ foo는 = bar]은 요소의 E 타입, "foo는 = bar"는 특성을 갖고있습니다
- 전자 [@ foo는 ^ = bar]은 요소의 E 타입, 그것을, 그리고 속성 "foo"라는 속성 값이는 "바"의 시작 부분에있습니다
- 전자 [@ foo는 $ = bar]은 요소의 E 타입, 그것을, 그리고 속성 "foo"라는있다는 특성 값을 "bar"가 말이다
- 전자 [@ foo는 *= bar]은 요소의 유형 전자, 그것을, 그리고 속성 "foo"라는있다는 특성 값을 ""막대가 포함되어있습니다
- 전자 [@ foo는 = bar]은 [@ 바즈 = 밥] 요소의 유형 전자, 그걸 = 밥 ""바즈 "foo는 = bar"가와 속성의 특성을 갖고있습니다
참고 : 위의 "바"와 "밥"문자열입니다.
문법에 의해 지원되지 1월 3일 jQuery 선택기 () 약식
실질적인 효과가 없기 때문에, 그래서 우리가 세부 사항으로 만들어 놓지 않았는 여기에 가고, 나는 공식적인 도움이 설명서를 읽을 수있는 더 배우고 싶습니다.
1월 4일 Contex 및 정박
Contex는 차이의 규범과 CSS를 jQuery (위치)를 선택, 앵커를 설정할 수있습니다. 사용자가 컨텍스트 루트를 설정하는 구문 : $ (expr라고, 문맥)를 사용할 수있습니다. 기본 컨텍스트 루트는 전체 문서입니다.
2. XPath를 선택기 (XPath를 선택기)
XPath는 또 하나의 선택 jQuer 구문에 의해 지원됩니다. jQuery 지원 기본 XPath 구문. 일러스트 레이션에 대한 몇 가지 예입 이하.
포지셔닝 1월 2일 경로 (위치 경로)
- 절대 경로로 전체 HTML 문서에 반대
$ ( "/ Html / 본문 / / p"가) $ ( "신체 / / p"가) $ ( "p 하이라이트 / .. / div")- 상대 경로로 "문맥 노드 집합에 반대"
$ (는 "P / *"이) $ ( "/ p 하이라이트 / /",이)축 선택기 2.2을 지원하는
- "/ p 하이라이트 자손 요소에 대한 모든 종류의 /": 엘리먼트의 자손 (div)
$ ( "/ 사업부 / / p"가) $("// div / / p "가)- 서브는 P - 요소에 대한 모든 종류의 "/": 하위 - 요소 (div)
$("// 사업부 / p "가)- 모든 종류의 "~": 형님 요소 (div) 요소의 동생 양식에
$("// 사업부 ~ 양식 ")- 아버지 ""..": 요소의 하위 요소의 유형 p 하이라이트 (div 부모 요소)
$("// 사업부 / .. / p "가)2.3 술어 문법 (Predicates)를 지원하는
- [@ foo는] "속성이"foo는있다
$("// 입력 [@ foo는] ")- [@ foo는 = '테스트'] 속성이 "foo는 = '테스트'"이다
$("// [@ foo는 = 'tsxt'] ")- [nodeList] (필터)를 사용하는 그들의 자녀와 손자 nodeList의 요소를 일치
$("// 사업부 [p 하이라이트] ") $("// div [p 하이라이트 /]")2월 4일 jQuery를 지원하지만, XPath를 사양 ()와 다른 문법 (Predicates) 술부
- [()] ()]가됩니다 또는 [순위 () = 마지막으로 지난 : 마지막 요소에 초점의 결과 (선택)
$ (는 "P : 마지막으로")- [0] 또는 [순위 () = 0]가 : 이퀄라이저 (0) 또는 첫 번째 요소에 초점을 맞춘의 결과 : 첫 번째 (선택)
$ (는 "P : 첫번째") $ ( "p 하이라이트 : 이퀄라이저 (0)")- [위치 () <5]가 : 그건 (5) 요소의 5 개 이상의 결과의 색인 (선택)
$ (는 "P : (5)") 다- [위치 ()> 2]가 : GT는 (2) 미만 2 요소의 집중 지수의 결과를 (선택)
$ (는 "P : (2)") GT는, 뒤쪽 jQuery 문법에 상응하는 비용입니다 참고 : ""predicates의 XPath 구문 앞에되고있다.
3. JQuery 선택기 사용자 정의 (사용자 정의 선택기)
일부 사용자 선택기 jQuery 문법, 이들은 CSS와 XPath를 사양에없습니다 비록 문법이,하지만 그들은 매우 편리합니다 와서 그들이 어디 원 jQuery.
3.1 사용자 정의 선택기 (사용자 선택기)
- :에 대한 집중도 지수는 결과도 - 번호 (도)은 요소의 nos
- : 이상한 결과가 홀수 (홀수)의 원소의 색인을 집중
- : 이퀄라이저 (N)을 그리고 : 니은 번째 회 (N) N이라는위한 요소의 색인의 결과에 초점을 선택할
- : (N)을 GT는 원소의 색인의 결과에 초점을 선택할 N보다 많습니다
- : (N)을 머릿속에 지수의 결과에 N은 요소의 초점을 선택할 미만입니다
- : 먼저 첫 번째 결과 요소 선택 (또는 니은 번째 (0) (0) EQ를 위해) 동급
- 마지막 요소에 초점의 결과 : 마지막 선택
- 요소의 결과에 초점 : 부모의 선택, 하위 있어야합니다 - 요소 (텍스트 노드를 포함) (:)는 반대로 빈
- :이 포함되어있습니다 ( '테스트')가 지정된 텍스트의 결과에 초점을 선택할 요소를 포함
- : 보이는)은 요소의, 블록, 인라인, 표시 또는 재산의 가치를 보이는 가시성 (디스플레이 속성 값, <입력 유형 = ""숨겨진 등 숨겨진 요소의 유형은 숨겨진 타입 (,를 포함하지 않는 모든 보이는 (보이는 선택 ... >))
- : 비공개)은 요소의 (디스플레이 속성 값이 아무것도 아니라면, 또는 속성을 숨김의 가치를 동등 가시성, 숨겨진 요소의 유형을 <input type="hidden"로서 그러한 …>))는 숨겨진 유형, (에 포함하지 않는 모든 숨겨진 (보이는 선택
예 :
$ (는 "P : 첫번째"). Css ( "fontWeight", "") 굵게; $ ( "div : 비공개"). 쇼 (); $ ( "/ div : 포함되어있습니다 ( '테스트')",이). 숨기기 ();선택기 2월 3일 양식 (양식 선택기)
- : 입력 (입력,, 텍스트, 버튼을 선택합니다) 모든 양식 요소 선택
- : 텍스트 (유형 = "텍스트")은 도메인의 모든 텍스트를 선택합니다.
- : 비밀 번호 (타입 = "비밀 번호") 모든 도메인 암호를 선택합니다.
- : 라디오 (유형 = "라디오")의 모든 라디오 버튼을 선택합니다.
- : 체크 (타입 = "체크")의 모든 확인란을 선택합니다.
- : 제출 선택 모두 (타입 = "제출") 버튼을 제출할 수있습니다.
- : 이미지 (유형 = "이미지") 모든 이미지의 도메인을 선택합니다.
- : (유형 = "재설정") 모든 재설정 재설정 버튼을 선택합니다.
- : 버튼 (유형 = "버튼")의 모든 버튼을 선택합니다.
- : 모든 파일 선택 <input type="file">.
: 비공개 위에서 설명한도 3.1에서 사용할 수있습니다.
옵션의 사용에 제안된 형태는 컨텍스트 루트, 예제를 제공하기 위해 :
$ ( '# MyForm을 : 입력')$ ( '입력 : 라디오', MyForm을)그의 최후 진술 위의 모든 "MyForm을"이에 상응하는 모든 라디오 버튼, [@ 유형 = 라디오] 양식 중 하나를 선택합니다 (즉, $ ( "[유형 = 라디오입니다], MyForm을")),하지만 표 단일 선택기 것이다있을 약간 빠르게, 큰 - 규모 양식 특히.
더 3월 3일 선택기
jQuery 선택기 - 3 - 파티 플러그인 기능을 확장할 수있습니다 :
- 기타 선택기 플러그인
- 마이크 Alsup 사용자 선택기에
- 패치는 CSS 속성에 의해 선택 (전체 플러그인 1.1를 동시에 출시 예정)을 허용하는
참조 :
http://docs.jquery.com/DOM/Traversing/Selectors
(2 투표, 평균 : 5 개 중 5 개의 아웃) -이 기사에 대한 평가에 오신 것을 환영합니다
로드 중입니다 ... 지난 180 days.Who 이내 아니 후원금 기부는 여기에 메시지를 남길 수 있도록했다.하세요 기부.이것은 WordPress에 플러그인 Wp - Donators. 그것은 지불 후이 컨테이너에 스폰서 정보 autoleave하는 스마트 기부 기능을 제공합니다. 사람을 기부할 수와 이름 / URL 또는 텍스트 광고를 제출할. 최신 기증자의 정보 구름에 표시됩니다. , 그들의 연결을 '미래에 가장 인기있는 지불 인터페이스를 지원하는 것입니다 be.It 더 큰 사람이 기부했다. ParPal 그냥 첫 한. 더많은 ..에 의해 제공 : 포스트 - DONATORS관련 로그
이 신문에서는 독자는 또한 다음에 대해 우려하고있다 :
- N / 한
회신을 남겨주