충남대학교 컴퓨터공학과 이규철 교수님의 "웹 프로그래밍" 강의를 필기한 내용입니다.
다소 잘못된 내용과 구어적 표현 이 포함되어 있을 수 있습니다.
본 문서는
작성자의 귀찮음때문에 참고 문서 링크들로 범벅되어 있습니다.
CDN Installation
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>Basic
Document onload
$(document).ready(function() {
// JQueries
});
$(function() {
// JQueries
});Selector
$(css-selector).JQueryMethod();Event listener
- $(el).click(listner: () => void)
- $(el).dblclick(listner: () => void)
- $(el).mouseenter(listner: () => void)
- $(el).mouseleave(listner: () => void)
- $(el).mousedown(listner: () => void)
- $(el).mouseup(listner: () => void)
- $(el).hover(listner: () => void)
- $(el).focus(listner: () => void)
- $(el).blur(listner: () => void)
- $(el).on({event: () => void})
Effects
- $(el).hide(speed: string | number, callback: () => void);
- $(el).show(speed: string | number, callback: () => void)
- $(el).toggle(speed: string | number, callback: () => void)
- $(el).fadeIn(speed: string | number, callback: () => void)
- $(el).fadeOut(speed: string | number, callback: () => void)
- $(el).fadeToggle(speed: string | number, callback: () => void)
- $(el).fadeTo(speed: string | number, opacity: number, callback: () => void)
- $(el).slideDown(speed: string | number, callback: () => void)
- $(el).slideUp(speed: string | number, callback: () => void)
- $(el).slideToggle(speed: string | number, callback: () => void)
- $(el).animate({cssProperty: string}, speed: string | number, callback: () => void)
- $(el).stop(stopAll?: bool, goToEnd?: bool)