웹디자인 2016-1
웹디자인 2016-1 홈페이지 디자인의 필수 기술 자바스크립트 (Javascript) 제이쿼리 (jQuery) HTML5 + CSS3 + JavaScript 자바스크립트 (Javascript) 동적인 웹페이지 디자인 제이쿼리 (jQuery) 자바스크립트 라이브러리
교재 모던 웹을 위한 JavaScript jQuery 입문, 윤인성, 한빛미디어, 2013
자바 스크립트 소개 자바스크립트(javascript): 동적인 웹 페이지를 작성하기 위 하여 사용되는 언어 웹의 표준 프로그래밍 언어 모든 웹브라우저들은 자바스크립트를 지원
HTML5 기술의 핵심
자바 vs 자바 스크립트
자바 스크립트 특징 인터프리터 언어 동적 타이핑(dynamic typing) 구조적 프로그래밍 지원 객체 기반 함수형 프로그래밍 지원 프로토타입-기반(prototype-based)
간단한 예제 <!DOCTYPE HTML> <html> <head> <title> My First Javascript </title> </head> <body> <script> var now = new Date(); document.write(now); </script> </body> </html> 웹브라우저에서 실행
자바 스크립트의 용도 이벤트에 반응하는 동작을 구현 AJAX HTML 요소들의 크기나 색상을 동적으로 변경 게임이나 애니메이션 사용자가 입력한 값들을 검증
jQuery jQuery- 일종의 자바 스크립트 라이브러리 무료이다.
jQuery 문장의 구조 $(...) 안에 선택자를 넣어서 원하는 요소를 선택하고, 선 택된 요소에 대하여 여러 가지 조작을 한다. $(“p”).show() - 모든 <p> 요소들을 찾아서 화면에 표시한다. $(“.group1”).slideup() - class=group1인 요소를 슬라이드업 방식으로 표시한다. $(“#id9”).hide() - id=id9인 요소를 화면에서 감춘다.
AJAX 개요 AJAX(Asynchronous JavaScript and XML)는 서버와 데이 터를 교환하는 기술의 하나
AJAX의 동작 원리
웹디자인 2016-1 성적 중간시험 (30%) 기말시험 (40%) 실습 (20%) 출석 (10%)