코밍이의 하루

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 효과 메소드 - 선택한 요소를 역동적으로 숨겼다가 보이게 만드는 기능을 가진 메소드 - 효과 메소드 종류 구분 종류 설명 숨김 hide() 요소를 숨김 fadeOut() 요소가 점점 투명해지면서 사라짐 slideUp() 요소가 위로 접히며 숨겨짐 노출 show() 숨겨진 요소 노출 fadeIn() 숨겨진 요소가 점점 선명해짐 slideDown() 숨겨진 요소가 아래로 펼쳐짐 노출, 숨김 toggle() hide(), show() 효과 적용 fadeToggle() fadeIn(), fa..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 그룹 이벤트 등록 메소드 - 한 번에 2개 이상의 이벤트를 등록할 수 있음. - 그룹 이벤트 등록 메소드 종류 종류 설명 on() - 이벤트 대상 요소에 2개 이상의 이벤트 등록 - 사용 방식에 따라 이벤트를 등록한 이후에도 동적으로 생성되거나 복제된 요소에도 이벤트 적용 bind() 이벤트 대상 요소에 2개 이상의 이벤트 등록 delegate() - 선택한 요소의 하위 요소에 이벤트 등록 - 이벤트를 등록한 이후에도 동적으로 생성되거나 복제된 요소에도 이벤트 적용 one() - 이벤..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 이벤트 객체 생성 기본형 $("이벤트 대상 선택").mousemove(function(매개변수) { 매개변수(이벤트 객체).속성; }); - 이벤트 객체의 속성 종류 구분 종류 설명 마우스 이벤트 clientX 마우스 포인터의 X 좌푯값 반환(스크롤 이동 거리 무시) clientY 마우스 포인터의 Y 좌푯값 반환(스크롤 이동 거리 무시) pageX 스크롤 X축의 이동한 거리를 계산하여 마우스 포인터의 X 좌푯값을 반환 pageY 스크롤 Y축의 이동한 거리를 계산하여 마우스 포인터의 Y..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 마우스 이벤트 - 사용자가 사이트에서 마우스를 이용해서 취하는 모든 행위 2) click() / dblclick() 메소드 - click() 이벤트 메소드 : 선택한 요소를 클릭했을 때 이벤트를 발생시키거나 선택한 요소에 강제로 클릭 이벤트를 발생시킬 때 사용 기본형 ① click 이벤트 등록 $("이벤트 대상 선택").click(function() {자바스크립트 코드;}); $("이벤트 대상 선택").on("click", function() {자바스크립트 코드;}); ② click ..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 이벤트 등록 메소드 - 이벤트 : 사이트에서 방문자가 취하는 모든 행위 - 이벤트 핸들러 : 이벤트가 발생했을 때 실행되는 코드 - 종류 : 단독 이벤트 등록 메소드 , 그룹 이벤트 등록 메소드 기본형 설명 버튼 $("#btn").click(function(){ 자바스크립트 코드; }); ① $("#btn") 이벤트 대상 ② click() 이벤트 등록 메소드 ③ function(){...} 이벤트 핸들러 - 이벤트 등록 메소드의 종류 구분 종류 설명 로딩 이벤트 load() 선택한 이..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3 개발환경 Visual Studio Code 참고 도서 [Do it] HTML5 + CSS3 웹 표준의 정석 웹브라우저 Chrome 2. 주요 문법 1) 태그 - 사용자가 입력하는 부분 만들 때 사용 2) id 속성 사용하기 - 최소한 1개 이상의 문자여야 하고 공백이 없어야 사용 가능 - 3) input 태그의 type 속성 유형 설명 hidden 사용자에게는 보이지 않지만 서버로 넘겨지는 값을 가짐 text 한 줄짜리 텍스트를 입력할 수 있는 텍스트 상자를 넣음 search 검색 상자를 넣음 tel 전화번호 입력 필드를 넣음 url URL 주소를 입력할 수 있는 필드를 넣음 email 메일 주소를 입력할 수 있는 필드를 넣음 password 비..