[JS][jQuery] $ 제이쿼리란? 적용/사용법

 

jQuery

자바스크립트의 라이브러리. 좀 더 간결하고 쉽게 사용할 수 있게 도와준다.

 

※ js코드는 좀 길잖습니까. ex) document.getElementId()
그걸 좀 더 간단히 적을 수 있게 하는 게 바로 jQuery라이브러리입니다.
다른 코드가 아니라 자바스크립트의 라이브러리입니다.
 html태그에 간단하게 이벤트를 주기 위해 많이 사용됩니다.

 

---

 

적용법

 

2024.12.28 - [📑 개발 사전/🛫 사이트 모음] - jQuery : 다운로드 받는 곳

 

Download -Download jQuery 클릭

 

마우스 우클릭 - 다른 이름으로 저장 - 오른쪽처럼 저장됩니다.

 

js - lib 폴더를 만들어 넣어줍니다.

 

이렇게 불러와 사용하면 됩니다.

 

💡 위에서는 파일로 저장해 안전하게 사용했지만, js파일 웹주소를 연결해 사용해도 상관은 없습니다.

 

---

 

사용법 $( )

---

 

html 태그 불러오기
$(css선택자) 

 

 

• $('여기'); 안에 css 선택자를 적어서 불러옵니다.
  2024.12.23 - [✨ UI/💙 CSS] - [CSS]선택자 종류와 사용법

 

---

 

값 가져오기
.val()

 

value가 아니라 val()을 적어사용합니다.

 

---

 

event 걸기
$('css선택자').이벤트(function(){
});

 

onclick 이벤트입니다.

 

---

 

이벤트	설명
.toggle();	숨기기/보이기
.after("<img src=' '/>");	이미지 추가
show();	보이기
hide();	숨기기
text();	텍스트 내보내기

이벤트는 javascript와 동일합니다. 하나 하나 외우기보다 필요할 때 찾아서 사용하는 게 좋습니다.

 

---

 

html문서 다 일고 js실행
$(function(){ });
$(document).ready(function(){ });

 

두 개 모두 window.onload처럼 html문서를 모두 읽고 실행됩니다.

 

---

 

css수정하기
.css(' ', ' ');
.css({' ': ' ', ' ': ' '});