jQuery를 사용하는 방법? jQuery 선택기란 무엇입니까?

본 글의 내용은 jQuery 사용법을 소개하는 것인가요? jQuery 선택기란 무엇입니까? jQuery 파일 라이브러리의 사용, 기본 구문 사용 및 jQuery 선택기의 사용법을 모든 사람이 이해할 수 있도록 하십시오. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

1. 사용 방법

jQuery 라이브러리는 모든 jQuery 기능이 포함된 JavaScript 파일에 있습니다.

웹페이지에서 jQuery를 사용해야 하는 경우 먼저 웹페이지에 jQuery의 js 파일을 도입해야 합니다.

76c82f278ac045591c9159d381de2c57
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
6cee78a5815e1ea034fd9f5df4179a0c
b2386ffb911b14667cb8f0f91ea547a7My Test JQuery6e916e0f7d1e588d4f442bf645aedb2f
    9b264bb87e5a392a4202120e2b17019f2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e

2. jQuery 구문

jQuery 구문은 HTML 요소를 선택하고 선택한 요소에 대해 특정 작업을 수행하는 것입니다. [추천 관련 동영상 튜토리얼: jQuery 튜토리얼]

기본 문법 형식:

 $(selector).action()

예:

$("p").hide()    // 隐藏所有 <p> 元素
$("#myInfo").hide() // 隐藏所有 id="myInfo" 的元素

# 🎜🎜#쓰기:

모든 jQuery 함수는 document.ready 함수에 있습니다. 아래 그림과 같습니다.

이것은 문서가 완전히 로드(준비)되기 전에 jQuery 코드가 실행되는 것을 방지하기 위한 것입니다. 즉, DOM이 로드될 때까지 DOM을 조작할 수 없습니다.

문서가 완전히 로드되기 전에 기능을 실행하면 작업이 실패할 수 있습니다.

    $(document).ready(function(){     
       // 代码部分写在这里     
    });

은 다음과 같이 축약될 수도 있습니다.

   $(function(){         
      // 这里写代码         
   });

예:

76c82f278ac045591c9159d381de2c57
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
6cee78a5815e1ea034fd9f5df4179a0c
b2386ffb911b14667cb8f0f91ea547a7My Test JQuery6e916e0f7d1e588d4f442bf645aedb2f
    9b264bb87e5a392a4202120e2b17019f2cacc6d41bbb37262a98f745aa00fbf0
    ea1aab715d1b735c8b112b6fff119ca8    
        $(function(){
           $("button").click(function(){
                $("#myDiv1").html("Hello JQuery World");
                $("#myDiv1").css("background-color","green");
            });
        });
    2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
    285f2ee1e472a25f04d29214b2020631点击65281c5ac262bf6d81768915a4a77ac0
    78a54985854ba9d1968e744276530244Hello16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e

　#🎜 🎜#

3. 기본 선택기

(1)

Element selector

: jQuery 요소 선택기는 이름을 기준으로 요소를 선택합니다. 예: 요소 선택기를 사용하여 모든 e388a4556c0f65e1904146cc1a846bee 요소를 선택하고 숨깁니다.

76c82f278ac045591c9159d381de2c57
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
6cee78a5815e1ea034fd9f5df4179a0c
b2386ffb911b14667cb8f0f91ea547a7My Test JQuery6e916e0f7d1e588d4f442bf645aedb2f
    9b264bb87e5a392a4202120e2b17019f2cacc6d41bbb37262a98f745aa00fbf0
    ea1aab715d1b735c8b112b6fff119ca8    
        $(function(){
           $("button").click(function(){
                $("p").hide();
            });
         
        });
    2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
    285f2ee1e472a25f04d29214b2020631点击65281c5ac262bf6d81768915a4a77ac0
    e388a4556c0f65e1904146cc1a846beep元素194b3e26ee717c64999d7867364b1b4a3
    e388a4556c0f65e1904146cc1a846beep元素294b3e26ee717c64999d7867364b1b4a3
    78a54985854ba9d1968e744276530244Hello16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e

　

(2)

#id 선택기

: jQuery #id 선택기는 HTML 요소 id를 전달합니다. 속성은 지정된 요소를 선택합니다. 페이지에 있는 요소의 ID는 고유해야 하므로 페이지에 있는 요소만 선택하려면 #id 선택기를 사용해야 합니다.

Example : #id 선택기를 사용하여 id="myDiv1"인 요소가 숨겨집니다.

76c82f278ac045591c9159d381de2c57
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
6cee78a5815e1ea034fd9f5df4179a0c
b2386ffb911b14667cb8f0f91ea547a7My Test JQuery6e916e0f7d1e588d4f442bf645aedb2f
    9b264bb87e5a392a4202120e2b17019f2cacc6d41bbb37262a98f745aa00fbf0
    ea1aab715d1b735c8b112b6fff119ca8    
        $(function(){
           $("button").click(function(){
                $("#myDiv1").hide();
            });
        });
    2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
    285f2ee1e472a25f04d29214b2020631点击65281c5ac262bf6d81768915a4a77ac0
    e388a4556c0f65e1904146cc1a846beep元素194b3e26ee717c64999d7867364b1b4a3
    e388a4556c0f65e1904146cc1a846beep元素294b3e26ee717c64999d7867364b1b4a3
    78a54985854ba9d1968e744276530244Hello16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e

　

(3)

.class 선택기

: jQuery 클래스 선택기는 지정된 클래스를 전달할 수 있습니다. 요소 찾기 . 예: 클래스 선택기를 사용하여 Class="myClass1"인 요소를 선택하고 숨깁니다.

76c82f278ac045591c9159d381de2c57
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
6cee78a5815e1ea034fd9f5df4179a0c
b2386ffb911b14667cb8f0f91ea547a7My Test JQuery6e916e0f7d1e588d4f442bf645aedb2f
    9b264bb87e5a392a4202120e2b17019f2cacc6d41bbb37262a98f745aa00fbf0
    ea1aab715d1b735c8b112b6fff119ca8    
        $(function(){
           $("button").click(function(){
                $(".myClass1").hide();
            });
        });
    2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
    285f2ee1e472a25f04d29214b2020631点击65281c5ac262bf6d81768915a4a77ac0
    e388a4556c0f65e1904146cc1a846beep元素194b3e26ee717c64999d7867364b1b4a3
    e388a4556c0f65e1904146cc1a846beep元素294b3e26ee717c64999d7867364b1b4a3
    78a54985854ba9d1968e744276530244Hello16b28748ea4df4d9c2150843fecfba68
    690022410a1995d4625bdc4d50bc75bc你好16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e

　

요약: 위 내용은 이 글의 전체 내용입니다. 모든 분들의 공부에 도움이 되었으면 좋겠습니다.

위 내용은 jQuery를 사용하는 방법? jQuery 선택기란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!