jQuery

자바스크립트 기술을 쉽게 사용할 수 있도록 해주는 자바스크립트 라이브러리

CDN 을 사용하면 jQuery를 즉시 웹 페이지로 불러 올 수 있음

jQuery CDN : https://releases.jquery.com/

jQuery 문법

문법 : $(선택자).행위()

$(this).hide() // 선택된 요소를 숨김

$("p").hide() // 모든 <p> 태그 요소를 숨김

$(".name").hide() // 모든 name 클래스 요소를 숨김

$("#test").hide() // 모든 test ID 요소를 숨김

$(document).ready()

$(document).ready()

함수를 이용하여 웹 문서가 준비됨과 동시에 특정 함수를 정의

$(document).ready(function() {
   $(".button").click(function() {
    $("#test").hide();
   });
});
// .button 요소가 클릭 될 경우 test 란 id 값을 가진 항목을 숨긴다.

jQuery events

종류	함수
Mouse	click, dbcick, mouseenter, mouseleave
Keyboard	keypress, keydown, keyup
Form	submit, change, focus, blur
Document/Window	load, resize, scroll, unload

이외에도 여러가지 이벤트가 존재하며, jQuery 에서 확인 할 수 있음

jQuery effect

자바스크립트를 이용해 만들어진 jQuery의 다양한 기술들

hide/show : 특정 요소를 숨기거나 보여줌 (toggle 기능을 이용하면 둘 다 적용 가능)

fade : 특정한 행위를 서서히 수행

slide : 미끄러지듯한 효과를 수행

animation : 애니메이션 효과를 수행

stop : 진행 중인 효과를 중단함

calback : 특정 효과가 완전히 끝난 후에 수행

chaining : 한번에 효과를 실행

jQuery HTML

HTML 요소에 접근할 수 있는 다양한 기술을 제공함

append() : 특정한 요소 안에서 끝 부분에 내용을 삽입

prepend() : 특정한 요소 안에서 앞 부분에 내용을 삽입

after() : 특정한 요소 이후에 내용을 삽입

before() : 특정한 요소 이전에 내용을 삽입