jqery 학습 의 세 가지 선택 기 간단 한 내용
찾 은 첫 번 째 요소 와 일치 합 니 다.
Matches the first selected element.
반환 값
Element
예시
표 의 첫 줄 찾기
HTML 코드:
Header 1 |
Value 1 |
Value 2 |
jQuery 코드:
$("tr:first")
결과:
[ Header 1 ]
---------------------------------------------------------------------------------------
:last
찾 은 마지막 요소 와 일치 합 니 다.
Matches the last selected element.
반환 값
Element
예시
표 의 마지막 줄 찾기
HTML 코드:
Header 1 |
Value 1 |
Value 2 |
jQuery 코드:
$("tr:last")
결과:
[ Value 2 ]
---------------------------------------------------------------------------------------
:not(selector)
주어진 선택 기 와 일치 하 는 모든 요 소 를 제거 합 니 다.
Removes all elements matching the given selector.
반환 값
Array
매개 변수
selector(Selector):선택 에 사용 할 선택 기
예시
선택 되 지 않 은 input 요 소 를 모두 찾 습 니 다.
HTML 코드:
jQuery 코드:
$("input:not(:checked)")
결과:
[ ]
---------------------------------------------------------------------------------------
:even
모든 색인 값 이 짝수 인 요소 와 일치 하 며 0 부터 계산 합 니 다.
Matches even elements, zero-indexed.
반환 값
Array
예시
표 의 1,3,5...줄 찾기(즉 색인 값 0,2,4...)
HTML 코드:
Header 1 |
Value 1 |
Value 2 |
jQuery 코드:
$("tr:even")
결과:
[ Header 1, Value 2 ]
---------------------------------------------------------------------------------------
:odd
모든 색인 값 이 홀수 인 요소 와 일치 하 며 0 부터 계산 합 니 다.
Matches odd elements, zero-indexed.
반환 값
Array
예시
표 의 2,4,6 줄 찾기(즉 색인 값 1,3,5...)
HTML 코드:
Header 1 |
Value 1 |
Value 2 |
jQuery 코드:
$("tr:odd")
결과:
[ Value 1 ]
---------------------------------------------------------------------------------------
:eq(index)
주어진 색인 값 과 일치 하 는 요소
Matches a single element by its index.
반환 값
Element
매개 변수
index(Number):0 부터 계산 합 니 다.
예시
두 번 째 줄 찾기
HTML 코드:
Header 1 |
Value 1 |
Value 2 |
jQuery 코드:
$("tr:eq(1)")
결과:
[ Value 1 ]
---------------------------------------------------------------------------------------
:gt(index)
주어진 색인 값 보다 큰 모든 요소 와 일치 합 니 다.
Matches all elements with an index above the given one.
반환 값
Array
매개 변수
index(Number):0 부터 계산 합 니 다.
예시
두 번 째 세 번 째 줄,즉 색인 값 은 1 과 2,즉 0 보다 크다.
HTML 코드:
Header 1 |
Value 1 |
Value 2 |
jQuery 코드:
$("tr:gt(0)")
결과:
[ Value 1, Value 2 ]
---------------------------------------------------------------------------------------
:lt(index)
주어진 색인 값 보다 작은 모든 요소 와 일치 합 니 다.
Matches all elements with an index below the given one.
반환 값
Array
매개 변수
index(Number):0 부터 계산 합 니 다.
예시
첫 번 째 두 번 째 줄,즉 색인 값 은 0 과 1,즉 2 보다 작 습 니 다.
HTML 코드:
Header 1 |
Value 1 |
Value 2 |
jQuery 코드:
$("tr:lt(2)")
결과:
[ Header 1, Value 1 ]
---------------------------------------------------------------------------------------
:header
h1,h2,h3 와 같은 제목 요소 와 일치 합 니 다.
Matches all elements that are headers, like h1, h2, h3 and so on.
반환 값
Array
예시
페이지 의 모든 제목 에 배경 색 을 추가 합 니 다.
HTML 코드:
Header 1
Contents 1
Header 2
Contents 2
jQuery 코드:
$(":header").css("background", "#EEE");
결과:
[
Header 1, Header 2
]---------------------------------------------------------------------------------------
:animated
애니메이션 효 과 를 실행 하지 않 은 모든 요소 와 일치 합 니 다.
Matches all elements that are currently being animated.
반환 값
Array
예시
애니메이션 효 과 를 실행 하지 않 는 요소 에 만 애니메이션 효 과 를 실행 합 니 다.
HTML 코드:
jQuery 코드:
$("#run").click(function(){ $("div:not(:animated)").animate({ left: "+20" }, 1000);}); ---------------------------------------------------------------------------------------
:contains(text)
주어진 텍스트 를 포함 하 는 요소 와 일치 합 니 다.
Matches elements which contain the given text.
반환 값
Array
매개 변수
text(String):찾기 위 한 문자열
예시
"John"을 포함 하 는 div 요 소 를 모두 찾 습 니 다.
HTML 코드:
John ResigGeorge MartinMalcom John SinclairJ. Ohn
jQuery 코드:
$("div:contains('John')")
결과:
[ John Resig, Malcom John Sinclair ] ---------------------------------------------------------------------------------------
:empty
하위 요소 나 텍스트 를 포함 하지 않 는 모든 빈 요소 와 일치 합 니 다.
Matches all elements that are empty, be it elements or text.
반환 값
Array
예시
하위 요소 나 텍스트 가 포함 되 지 않 은 모든 빈 요 소 를 찾 습 니 다.
HTML 코드:
Value 1 Value 2
jQuery 코드:
$("td:empty")
결과:
[ , ] ---------------------------------------------------------------------------------------
:has(selector)
선택 기 에 일치 하 는 요 소 를 포함 하 는 요소 와 일치 합 니 다.
Matches elements which contain at least one element that matches the specified selector.
반환 값
Array
매개 변수
selector(Selector):선별 에 사용 할 선택 기
예시
p 요 소 를 포함 하 는 모든 div 요소 에 text 클래스 를 추가 합 니 다.
HTML 코드:
Hello
Hello again!
jQuery 코드:
$("div:has(p)").addClass("test");
결과:
[ Hello
] ---------------------------------------------------------------------------------------
:parent
하위 요소 나 텍스트 를 포함 하 는 요소 와 일치 합 니 다.
Matches all elements that are parents - they have child elements, including text.
반환 값
Array
예시
하위 요소 나 텍스트 를 포함 하 는 td 요 소 를 모두 찾 습 니 다.
HTML 코드:
Value 1 Value 2
jQuery 코드:
$("td:parent")
결과:
[ Value 1, Value 1 ]
예시
애니메이션 효 과 를 실행 하지 않 는 요소 에 만 애니메이션 효 과 를 실행 합 니 다.
HTML 코드:
jQuery 코드:
$("#run").click(function(){ $("div:not(:animated)").animate({ left: "+20" }, 1000);}); ---------------------------------------------------------------------------------------
:contains(text)
주어진 텍스트 를 포함 하 는 요소 와 일치 합 니 다.
Matches elements which contain the given text.
반환 값
Array
매개 변수
text(String):찾기 위 한 문자열
예시
"John"을 포함 하 는 div 요 소 를 모두 찾 습 니 다.
HTML 코드:
John Resig
George Martin
Malcom John Sinclair
J. Ohn
jQuery 코드:
$("div:contains('John')")
결과:
[
:empty
하위 요소 나 텍스트 를 포함 하지 않 는 모든 빈 요소 와 일치 합 니 다.
Matches all elements that are empty, be it elements or text.
반환 값
Array
예시
하위 요소 나 텍스트 가 포함 되 지 않 은 모든 빈 요 소 를 찾 습 니 다.
HTML 코드:
jQuery 코드:
$("td:empty")
결과:
[ , ] ---------------------------------------------------------------------------------------
:has(selector)
선택 기 에 일치 하 는 요 소 를 포함 하 는 요소 와 일치 합 니 다.
Matches elements which contain at least one element that matches the specified selector.
반환 값
Array
매개 변수
selector(Selector):선별 에 사용 할 선택 기
예시
p 요 소 를 포함 하 는 모든 div 요소 에 text 클래스 를 추가 합 니 다.
HTML 코드:
jQuery 코드:
$("div:has(p)").addClass("test");
결과:
[ ] ---------------------------------------------------------------------------------------
:parent
하위 요소 나 텍스트 를 포함 하 는 요소 와 일치 합 니 다.
Matches all elements that are parents - they have child elements, including text.
반환 값
Array
예시
하위 요소 나 텍스트 를 포함 하 는 td 요 소 를 모두 찾 습 니 다.
HTML 코드:
jQuery 코드:
$("td:parent")
결과:
[ Value 1, Value 1 ]
jQuery 코드:
$("div:contains('John')")
결과:
[
John Resig
, Malcom John Sinclair
] ---------------------------------------------------------------------------------------:empty
하위 요소 나 텍스트 를 포함 하지 않 는 모든 빈 요소 와 일치 합 니 다.
Matches all elements that are empty, be it elements or text.
반환 값
Array
예시
하위 요소 나 텍스트 가 포함 되 지 않 은 모든 빈 요 소 를 찾 습 니 다.
HTML 코드:
Value 1 | |
Value 2 |
jQuery 코드:
$("td:empty")
결과:
[ , ] ---------------------------------------------------------------------------------------
:has(selector)
선택 기 에 일치 하 는 요 소 를 포함 하 는 요소 와 일치 합 니 다.
Matches elements which contain at least one element that matches the specified selector.
반환 값
Array
매개 변수
selector(Selector):선별 에 사용 할 선택 기
예시
p 요 소 를 포함 하 는 모든 div 요소 에 text 클래스 를 추가 합 니 다.
HTML 코드:
Hello
Hello again!
jQuery 코드:
$("div:has(p)").addClass("test");
결과:
[
Hello
:parent
하위 요소 나 텍스트 를 포함 하 는 요소 와 일치 합 니 다.
Matches all elements that are parents - they have child elements, including text.
반환 값
Array
예시
하위 요소 나 텍스트 를 포함 하 는 td 요 소 를 모두 찾 습 니 다.
HTML 코드:
Value 1 | |
Value 2 |
jQuery 코드:
$("td:parent")
결과:
[ Value 1, Value 1 ]
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
leetcode 알고리즘 문제 170 (단순 042) 두 수의 합 III - 데이터 구조 설계leetcode 알고리즘 문제 170 (단순 042) 두 수의 합 III - 데이터 구조 설계 제목 소개 예시 add(1); add(3); add(5); find(4) -> true find(7) -> false a...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.