JQuery 제이쿼리 빠르게 기본 익히기

제이쿼리는 자바스크립트 언어를 간편하게 사용할 수 있도록 단순화시킨 오픈 소스 기반의 자바스크립트 라이브러리입니다.

제이쿼리를 사용하면 아주 간편하게 HTML 요소를 선택하고, 그렇게 선택된 요소에 손쉽게 특정 동작을 설정할 수 있습니다.

 

제이쿼리 기본 문법

$(선택자).동작함수();

$() 함수의 인수로는 HTML 태그 이름뿐만 아니라, CSS 선택자를 전달하여 특정 HTML 요소를 선택할 수 있습니다.

이러한 $() 함수를 통해 생성된 요소를 제이쿼리 객체(jQuery object)라고 합니다.

※ $() 함수에 전달되는 인수는 반드시 따옴표("")를 사용한 문자열 형태로 전달되어야 합니다.

 

선택자 문법 

• 클래스 선택자 - $('.item')
• 태그 선택자 - $(div)
• 아이디 선택자 - $("#target")

✨여러개의 선택자 불러오기 

class="slick-cell l6 r6 tar”  일때

$(".slick-cell.l6.r6 tar")

 

인접선택자 문법 

제이쿼리 함수

• .stop() - 현재 동작하고 있는 애니메이션은 즉시 동작이 중단된다
• .trigger() - 강제로 이벤트를 만드는 함수
• .hasClass()- if문을 통해 클래스가 존재하는지 확인
• .is() - 선택한 요소에서 주어진 선택자가 있는지 판별합니다.

if($("#div").hasClass("active") === true) {

// class가 존재함

} else {

// class가 존재하지않음

}