오봉이와 함께하는 개발 블로그

사용자 정의 객체 사용자가 직접 필요한 객체를 생성해서 사용 사용자 정의 객체 생성 방법 리터럴 이용 생성자 함수(function()) 이용 new Object() 이용 class 정의하고 객체 생성 리터럴 이용 객체 선언 : 멤버 추가 프로퍼티(속성) : 속성값 멤버 메소드 추가 형식 var 객체 = { // 변수 :프로퍼티(속성) 프로퍼티명(속성명)1 : 값1, 프로퍼티명(속성명)2 : 값2 // 멤버 메소드 메소드 명 : function() { 수행 코드 } }; // 예시 var person = { name : "홍길동", age : 20, getName = function() { return this.name; } }; // 객체 사용 객체.프로퍼티; 객체.메소드(); // 예시 person.g..

폼 유효성 확인 form 객체 document 객체의 하위 객체 form 태그 내에 있는 여러 입력 양식을 제어 form의 하위 객체들 from 객체 사용 방법 태그의 name 속성을 객체로 사용하는 경우 newMemberForm.id.focus(); newMemberForm.id.value = “”; newMemberForm.passwd.focus(); 문서 객체 모델(DOM) 방식을 사용하는 경우 var name = document.getElementById(‘name’); name.focus(); name.value = ""; 폼 유효성 확인 성명을 입력하지 않은 경우 id를 입력하지 않은 경우 혹은 길이가 6 ~ 10자가 아닌 경우 비밀번호와 비밀번호 확인의 값이 같지 않은 경우 var 변수 이름..

이벤트 핸들러와 이벤트 처리 인라인 방식과 고전 방식의 이벤트 처리 방식의 경우 동일한 객체에 대해 동일한 이벤트를 여러 번 사용 불가(마지막 이벤트 하나만 적용) 자주 사용되는 이벤트 핸들러 onLoad: HTML 문서나 특정 요소가 로드되었을 때 발생 onUnload: HTML 문서나 특정 요소가 사라질 때 발생 onClick: 클릭했을 때 발생 onKeyUp: 키를 눌렀다가 떼었을 때 발생 onKeyPress: 키를 누를 때 발생 onMouseDown: 마우스 버튼 눌렀을 때 발생 onMouseUp: 마우스 버트느 눌렀다가 떼었을 때 발생 onMouseOver: 포커스로 마우스 포인터가 들어갈 때 발생 onMouseOut: 포커스에서 마우스 포인터가 나갈 때 발생 onResize: 무서의 특정 요소..

문서 객체 모델(Document Object Model) 객체 지향 모델로서 구조화된 문서를 표현하는 형식 HTML 문서에 접근하기 위한 표준 모델 표준은 대부분의 브라우저에서 DOM을 구현하는 기준 문서 내의 모든 요소를 정의하고, 각 요소에 접근하는 방법을 제공 웹 브라우저에서 보여지는 HTML 문서 태그 요소에 대한 정보와 문서에 대한 여러 가지 속성을 제공 document 객체의 하위 객체를 이용하여 문서 내에서 일어나는 다양한 기능 제어 DOM 사용 시기 HTML 문서가 로드되고 나서 파싱 작업을 거쳐 DOM 트리 생성 DOM 문서가 로드될 때 모든 DOM을 사용할 수 있게 되는 때임 문서 내의 요소(태그) 제어 메소드 createElement('태그명') : 요소 노드 생성 cr..

자바스크립트 객체 내장객체 브라우저 객체 문서 객체(DOM) 사용자 정의 객체 브라우저 객체 모델 자바스크립트에서는 웹 페이지를 구성하는 HTML 태그의 모든 요소와 웹 브라우저를 구성하는 요소들을 객체로 정의하여 제공 객체들을 계층 구조로 분류 브라우저 객체 웹 브라우저를 대상으로 이루어진 객체 window 객체 : 창 document 객체 : 문서 history 객체 : 웹 브라우저 기록 정보 location 객체 : 주소 정보 navigator 객체 : 웹 브라우저 정보(종류 판별 등) navigator 객체 브라우저에 관한 정보 제공 객체 속성 appCodeName : 브라우저의 코드명 appName : 브라우저의 종류 appVersion : 브라우저의 버전 cookieEnabled : 쿠키 사용..