jQuery) jQuery 다운로드, load 이벤트

안녕하세요, 코린이의 코딩 학습기 채니 입니다.

 

개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다.

---

점유율이 점점 떨어지고 있는 제이쿼리지만.. 알면 좋으니까 살짝 공부해보았습니다.

 

jQuery 다운로드

https://jquery.com/download/

Download jQuery | jQuery

버전이 여러가지지만, 개발용 jQuery를 다운로드 받아주겠습니다.

 

클릭하면 이러한 창이 나오고 여기서 마우스 우클릭 - 다른이름으로 저장해줍니다.

 

vs code로 이동하여 js 폴더 생성 - 다운로드 받은 jQuery를 옮겨줍니다.

 

script src에 다운로드 받은 jQuery를 import 해준 후 사용해줍니다.

<script src="../js/jquery-3.6.0.js"></script>

 

---

window의 load 이벤트 핸들러

① $(document).ready()

$(document).ready(() => {
    console.log('jQuery 사용 가능합니다. 1');
});

$는 변수이고, 함수를 가지고 있습니다. 즉, $()는 함수!

$(document)하니 어떠한 객체가 넘어온 것을 확인할 수 있고, 해당 객체에서 ready() 메소드를 사용하였습니다.

 

② $()

-  jQuery CDN

- CDN (Content Delievery Network) : stackpath, cloudflare

<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>

$(() => {
    console.log('jQuery 사용 가능합니다. 2');
});

 

③jQuery(document).ready()

jQuery(document).ready(() => {
    console.log('jQuery 사용 가능합니다. 3');
});

 

jQuery는 $를 사용하며, $와 jQuery는 동일합니다.

($ === jQuery → true)