>웹 프론트엔드 >프런트엔드 Q&A >jquery 검색 메서드 호출

jquery 검색 메서드 호출

WBOY
WBOY원래의
2023-05-12 09:59:38533검색

jQuery는 HTML, CSS 및 DOM을 조작할 수 있는 다양한 메서드와 기능을 제공하는 가장 인기 있는 JavaScript 라이브러리 중 하나입니다. 그 중 검색방법은 가장 기본적이고 일반적으로 사용되는 방법 중 하나이다. 이 기사에서는 jQuery의 검색 방법과 호출 방법을 소개합니다.

1. 기본 선택기

jQuery의 기본 선택기 방법은 HTML 요소를 선택하는 데 사용됩니다. 다음은 기본 선택기의 호출 방법입니다.

1. 요소 이름으로 선택

$("elementName") //elementName은 $("div")

와 같은 HTML 요소의 이름입니다. 클래스 이름으로 선택

$(".className") //className은 $(".main")

과 같이 CSS에 정의된 클래스 이름입니다. 3. ID로 선택

$("#id") / /id는 $("#header")

4와 같은 HTML 요소 ID입니다. Select by attribute

$("[attribute=value]") //attribute는 클래스, ID일 수 있는 속성 이름입니다. 또는 모든 사용자 정의 속성 값은 $("[type='submit']")

2와 같은 속성 값입니다. 계층적 선택기

계층적 선택기 방법은 상위-하위 또는 형제 관계가 있는 HTML 요소를 선택하는 데 사용됩니다. . 다음은 계층적 선택기의 호출 방법입니다:

1. 하위 요소 선택

$("parent child") //parent는 상위 요소이고 child는 $(".wrapper p")와 같은 하위 요소입니다.

2. 직접 하위 요소 선택

$("parent > child") //부모는 상위 요소이고 하위는 하위 요소입니다(예: $(".wrapper > p")

3. 인접 형제 요소

$ ("prev + next") //prev는 이전 형제 요소이고 next는 다음 형제 요소입니다. 예: $("#header + p")

4 모든 형제 요소를 선택합니다

. $("prev ~ siblings" ) //prev는 이전 형제 요소이고, siblings는 $(".main ~ li")

3과 같이 모든 후속 형제 요소입니다. 필터 선택기

필터 선택기 방법이 사용됩니다. 선택한 요소 세트를 필터링하고 합산합니다. 기준에 맞는 요소를 선택합니다. 다음은 필터 선택기의 호출 방법입니다.

1. 첫 번째 요소 선택

$("selector:first") //selector는 $("p:first")

와 같은 선택기입니다. 마지막 요소 선택

$("selector:last") //selector는 $("p:last")

3와 같은 선택기입니다. 3. 홀수 요소를 선택하세요

$("selector:odd" ) / /selector는 $("li:odd")

4. 짝수 요소 선택

$("selector:even") //selector는 $("li와 같은 선택기) :even ")

5. 지정된 텍스트가 포함된 요소를 선택하세요

$("selector:contains(text)") //selector는 임의의 선택기이고 text는 포함된 텍스트입니다(예: $("p:contains() 'Hello World')")

4. 속성 필터링

속성 필터링 방법은 선택한 요소 컬렉션에서 조건을 충족하는 요소를 필터링하는 데 사용됩니다. 다음은 속성 필터링의 호출 방법입니다.

1. 지정된 속성이 있는 요소를 선택합니다.

$("selector[attribute]") //selector는 임의의 선택자이고 attribute는 $("와 같은 속성 이름입니다. a[href]" )

2. 지정된 속성이 있는 요소를 선택하고 속성 값에 지정된 텍스트가 포함됩니다

$("selector[attribute*=value]") //selector는 임의의 선택기이고 attribute는 속성입니다. name, value는 포함된 텍스트입니다(예: $("a[href*='https']")

3. 지정된 속성이 있는 요소와 지정된 텍스트로 시작하는 속성 값을 선택하세요

$(" selector[attribute^=value]") //selector는 선택 장치이고 attribute는 속성 이름, value는 $("input[type^='text']")

4와 같은 시작 텍스트입니다. 지정된 속성이 있는 요소를 선택하면 속성 값이 지정된 텍스트로 끝납니다

$("selector [attribute$=value]") //selector는 선택기이고 attribute는 속성 이름이고 value는 $("img[src$='.jpg']")

5. 양식 필터

양식 필터 방법은 양식 요소의 조건을 충족하는 요소를 필터링하는 데 사용됩니다. 다음은 양식 필터를 호출하는 방법입니다.

1. 모든 양식 요소를 선택합니다.

$(":input") //예: $(":input")

2. 모든 텍스트 입력 상자를 선택합니다. (" input:text") //$("input:text")

3. 비밀번호 입력란을 모두 선택하세요

$("input:password") //$("input:password")

4. 모든 라디오 버튼 상자 선택

$("input:radio") //예: $("input:radio")

5. 모든 확인란 선택

$("input:checkbox") / /예를 들어 $( "input:checkbox")

6. 기타 선택자

위에서 소개한 기본 선택자, 계층적 선택자, 필터 선택자, 속성 필터, 폼 필터 외에도 jQuery는 컨텐츠 선택자, 가시성 등의 기능도 제공합니다. 선택기와 상태 선택기 및 더욱 강력한 선택기 방법. 이들 메소드의 호출 메소드는 위의 호출 메소드와 유사하므로 여기서는 다시 설명하지 않습니다.

요약

이 글에서는 기본 선택기, 계층적 선택기, 필터 선택기, 속성 필터, 양식 필터 및 기타 선택기를 포함하여 jQuery의 검색 방법과 이를 호출하는 방법을 소개합니다. 실제 개발에서는 이러한 방법과 기능을 숙지하는 것이 매우 중요하며 이는 개발 효율성과 코드 품질을 크게 향상시킬 수 있으며 경쟁력을 향상시키는 중요한 수단이기도 합니다.

위 내용은 jquery 검색 메서드 호출의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.