목록티스토리 (214)
EverGiver
이벤트란? 이벤트란 일종의 알림 기능이다. 사용자가 마우스를 클릭하거나 키보드 키를 입력하면 브라우저는 입력정보를 이벤트에 담아 개발자에게 알려준다. 이벤트 종류 크게 네 가지 종류로 분류할 수 있다. 마우스 이벤트 키보드 이벤트 태그요소 고유 이벤트 사용자 정의 이벤트 핵심 내용 일반 이벤트 등록 $대상.on("이벤트이름", 이벤트리스너) 단축 이벤트 등록 $대상.단축이벤트(이벤트리스너) - 단축 이벤트 목록 ▷ click : 클릭했을 경우 ▷ mouseup : 마우스에서 손가락을 땐 순간 ▷ mousedown : 마우스를 누르는 순간 ▷ mouseover : 마우스를 올렸을 때 ▷ mouseout : 마우스가 빠져나갔을 때 ▷ focus : 커서가 이동했을 때 ▷ blur : 커서가 빠져나갔을 때..
스타일 다루기 스타일 값 구하기 $대상.css("스타일 속성이름") $대상.css(["스타일 속성이름","스타일 속성이름",...]) 스타일 값 설정하기 $대상.css("속성이름", "값") $대상.css({ 속성이름:값 속성이름:값 }) 클래스 추가 $대상.addClass("클래스 이릅1 [클래스 이름2 ...]") 클래스 삭제 $대상.removeClass()// 모든 클래스 삭제 $대상.removeClass("클래스 이름1 [클래스 이름2 ...]") cf) ▷ css (width, height, background...) - $('p').css('width', 300) : width를 변경 - $('p').width(300) : width를 변경 - $('p').css('width') : wi..
산술연산자 문자 결합 연산자 문자형 데이터 + 문자형 데이터 = 하나의 문자형 데이터 숫자형 데이터 + 문자형 데이터 = 하나의 문자형 데이터 숫자형 데이터 + 숫자형 데이터 = 하나의 숫자형 데이터 대입 연산자 연산된 데이터를 최종적으로 다시 원래의 변수에다가 치환 증감 연산자
변수 데이터를 저장할 수 있는 메모리 공간 (한 개의 데이터만 저장이 가능하고, 새로운 데이터가 들어가면 이전 데이터는 삭제된다) 변수 이름 지정 시 주의사항 띄어쓰기는 하지 않는다. 한글은 되도록 쓰지 않는다. 영어는 대소문자를 구분한다. 특수기호는 _ $만 사용 가능하다. 첫 글자는 숫자를 사용하지 않는다. 약속어를 사용하지 않는다. (document, window, name...) 변수 이름에 의미를 정확히 부여한다. 데이터 유형 문자형 데이터 - String 숫자형 데이터 - Number 논리형 데이터 - Boolean 비워진 데이터 - null, undefined cf) typeof : 데이터 유형을 체크하는 명령어 지역변수와 전역변수
일반 노드 찾기 아이디 이름으로 노드 찾기 $("#아이디 이름") 태그 이름으로 노드 찾기 $("태그 이름") 클래스 이름으로 노드 찾기 $(".클래스이름") 속성으로 노드 찾기 $("속성옵션") - $("E[A]") : 속성 A를 포함한 모든 E 노드 찾기 - $("E[A=V]") : 속성 A값이 V인 모든 E 노드 찾기 - $("E[A^=V]") : 속성 A값이 V로 시작하는 모든 E 노드 찾기 - $("E[A$=V]") : 속성 A값이 V로 끝나는 모든 E 노드 찾기 - $("E[A*=V]") : 속성 A값이 V를 포함하고 있는 모든 E 노드 찾기 cf) - $('선택자').css('속성', '속성 값'); : 속성을 1개만 변경 - $('선택자').css({'속성':'속성 값', '속성':..
jQuery css 선택자를 사용하여 구동 (자바스크립트 라이브러리 파일) 자바스크립트 요소 중 '자바스크립트 DOM' 부분을 좀 더 쉽게 사용할 수 있게 도와주는 라이브러리 jQuery 라이브러리 삽입 CDN(Content Delivery Network)에 올려져 있는 jQuery 파일을 이용 - CDN : 콘텐츠를 여러 서버에 분산 배치해서 콘텐츠를 전송하는 과정에서 발생하는 트래픽 집중 & 병목 현상 및 데이터 손실을 해결하기 위한 기술 - 대표 CDN ▷구글 Ajax API CDN https://developers.google.com/speed/libraries#jquery ▷ 마이크로소프트 CDN https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.6.0.min..