1. jQeury 이벤트 처리 함수1) jQeury 이벤트 처리 함수 등록법12_event.html jQuery Event Handle 버튼을 눌러보세요. 2) jQeury 이벤트 처리 함수 내 this 키워드13_event_this.html jQuery Event Handle 저녁 메뉴를 선택해 주세요. 가정식 백반 짜장면 짬뽕 설렁탕 순대국 삼계탕 쌀국수 돈까스 선택한 저녁 메뉴는 ???입니다. 3) 이벤트 처리함수 등록 on키워드(일반형)14_event_on.html jQuery Event Handle 마우스를 클릭하거나 이동해 보세요. 4) 이벤트 처리함수 제거 off키워드15_event_off.html jQuery Event Handle 이벤트 처리 함수 등록 ..
분류 전체보기
1. jQuery 라이브러리1) jQuery 개요Vanilla JS (바닐라 자바스크립트)순수하게 자바스크립트만 이용해서 동적인 페이지 만드는 것자바스트립트 라이브러리 & 프레임워크기능들을 쉽게 구현할 수 있도록 자바스크립트는 라이브러리나 프레임워크를 제공함자바스크립트 라이브러리단순히 필요한 기능들을 제공대표적 예 : 제이쿼리(디자인 만들때 사용), 리액트(프론트앤드개발 시 사용)자바스크립트 프레임워크기능을 포함해 프로그램을 쉽게 개발하기 위한 전체적인 환경 제공대표적 예 : Angular.jsCSS 프레임워크대표적 예 : 부트스트랩( 모든 디자인들이 다 완성되었으니, 가져다 쓰면 페이지 구현 가능 )2) jQuery자바스크립트 라이브러리Write less, do more (적게 작성하고, 보다 많이 한..
🍪쿠키(Cookie)서버와 클라이언트에 연결 지속성을 제공하기 위해 클라이언트에 저장한 문자값접속된 웹서버의 이름을 식별자로 사용하여 다수의 쿠키를 저장하며, 웹서버에 접속하여 웹프로그램을 요청할 경우 웹서버의 이름으로 저장된 모든 쿠키를 웹프로그램에게 전달서버에 웹프로그램 요청 시 기본적으로 쿠키는 무조건 전달되므로 활용하면 됨🍪쿠키 & 웹서비스서버와 클라이언트의 연결의 지속성을 제공하지 않음요청에 응답 후 서버가 먼저 끊음 왜?익명의 다수의 사용자가 웹 서비스를 이용하므로 연결지속성을 허용하게 되면 접속된 사용자마다 소켓을 만들어야 하므로 메모리 차지가 많아짐즉, 동시접속자가 많아질수록 서버에 요청에 대한 응답이 계속 지연됨그렇다면 기존요청사용자 vs 새로운요청사용자 구분 어떻게?쿠키를 통해 알..
1.이벤트 처리 함수 작성법41_event_handle.html이벤트(Element 객체)에서 발생되는 다양한 이벤트는 자바스크립트를 이용하여 이벤트 처리 명령을 작성하여 실행동적인페이지( js ) : id 식별자 많이 사용 VS 스타일링( css ) : class 속성값 많이 사용1) 방법1. HTML + JS 같이 이용HTML 태그의 이벤트 속성의 속성값으로 이벤트 처리 명령(함수 호출)을 작성하여 이벤트가 발생될 경우 이벤트 처리 명령이 실행되도록 처리 버튼-12) 방법2. JS만 이용 : 유지보수가 더 쉬움 - 권장Element 객체(태그)에 이벤트 속성을 프로퍼티로 설정해서 이벤트 처리 함수를 등록하여 이벤트가 발생될 경우 이벤트 처리 함수가 호출되..
DOM(Document Object Model)브라우저의 출력영역(document 객체)을 기반으로 제공되는 자바스크립트 객체자바스크립트에서는 요청 웹프로그램(웹문서)의 실행결과를 응답받아 출력되는 영역을 document 객체로 표현하며 document 객체에 출력되는 태그(박스모델)는 Element 객체로 표현하여 처리 1. DHTML 작성하는 법 (동적인페이지)브라우저에서 이벤트가 발생될 경우에는??이벤트 처리 명령으로 박스모델(Element 객체)을 조작하여 동적인 페이지 제공 >> DHTML (Dynamic HTML)이벤트(Event) : 태그(박스모델)에서 발생되는 다양한 사건이벤트 처리(Event Handle) : 태그에서 발생된 이벤트에 대한 처리 명령 - 자바스크립..
BOM(Browser Object Model)BOM : 브라우저를 기반으로 제공받는 자바스크립트 내장 객체window 객체screen 객체navigator 객체location 객체document 객체1. window 객체30_window.htmlwindow 객체 : 브라우저를 객체로 표현하여 프로퍼티와 메소드 제공alert(window); //[object Window]window 객체의 메소드//1.//💛window.alert(message) : 메세지창(경고창)을 이용하여 메세지를 출력하는 메소드// => window 객체를 생략해도 메소드 호출 가능 - 함수// => 웹프로그램을 만들 때 보다는 디버깅할 때 사용// => 요즘 비권장//window.alert..
자바스크립트 표준 내장 객체자바스크립트에서 기본으로 내장된 객체스코프의 위치 따지지 않고 모든 영역에서 공통으로 사용 가능JavaScript 사전 - 생활코딩 JavaScript 사전 - 생활코딩코스소개 생활코딩 자바스크립트 사전은 자바스크립트가 기본적으로 제공하는 객체를 대분류로 각 객체에 속하는 메소드들을 열거하고 있습니다. opentutorials.org 1. Number클래스 함수25_Number.html숫자값이 저장된 객체를 생성하기 위한 클래스 함수 - 객체에 대한 프로퍼티와 메소드 제공자바의 Integer클래스 Double 클래스와 비슷1) 사용방법1. Number 객체생성 후 요소 사용Number 객체 생성//매개변수에 전달된 숫자값이 저..