자바스크립트 명령어 총정리
window 객체
- 최상위 객체로서 다른 객체의 조상이 됨
속성 역할 defaultStatus 상태바(status bar)에 나타날 기본값을 설정 frames 윈도우 안에 들어 있는 프레임 객체 length 윈도우에 있는 프레임의 수 name 윈도우나 프레임의 이름 opener 현재 열려있는 윈도우 parent 윈도우가 계층구조일때 상위 객체 self 자신의 윈도우 status 상태바에 출력되는 문자열 top 윈도우가 계층구조일 때 최상위 객체 windows 현재의 윈도우 innerHeight 윈도우 안에 있는 내용의 높이 innerWidth 윈도우 안에 있는 내용의 너비 outerHeight 윈도우 밖의 테두리 높이 outerWidth 윈도우 밖의 테두리 너비 pageXOffset 윈도우에 현재 나타난 페이지의 x 좌표 pageYOffset 윈도우에 현재 나타난 페이지의 y 좌표 locationbar locationbar를 나타낼지의 여부 menubar 매뉴바를 나타낼지의 여부 personalbar personalbar를 나타낼지의 여부 scrollbars scrollbar를 나타낼지의 여부 statusbar statusbar를 나타낼지의 여부 toolbar toolbar를 나타낼지의 여부 tags 웹페이지에 사용된 모든 tag 정보 method 역할 alert() 경고 메시지를 나타내는 대화창 출력 blur() 윈도우로부터 입력 커서를 없앰 close() 윈도우 닫기 confirm() 사용자에게 확인/취소를 선택하는 대화창 출력 open() 윈도우 열기 prompt() 사용자가 메시지를 입력함 setTimeout() 1000분의 1초 단위로 지정된 명령 실행 clearTimeout() setTimeout을 해제 setInterval() 일정 간격으로 명령을 실행 scroll() 특정 위치로 스크롤 시킴 find() 윈도우 안에서 원하는 문자 검색 print() 윈도우 내용을 프린터로 출력 event handler 역할 onBlur 윈도우 안에서 커서가 없어졌을 때 onError 문서를 읽다가 오류가 발생할 때 onFocus 윈도우에 커서가 있을 때 onLoad 브라우저로 문서가 읽혀질 때 onUnload 브라우저에서 문서가 사라질 때 onDragDrop 브라우저에서 드래그앤드롭시켰을 때 onMove 윈도우를 움직였을 때 onResize 윈도우의 크기가 변경될 때
- 예제
settimeout() : 밀리초 단위로 지정된 지연시간 후 지정된 함수를 호출합니다.
이 메서드를 사용하는 대신 지정된 간격을 사용하고 repeatCount 매개변수로 1을 사용하여 한 번만 실행되는 Timer 객체를 만드는 것이 좋습니다.
clearTimeout() 메서드를 사용하여 setTimeout() 호출을 취소하려면 clearTimeout() 메서드에서 나중에 참조하는 변수에 setTimeout() 호출을 할당해야 합니다.
매개변수 closure: Function - 실행할 함수의 이름입니다. 따옴표나 괄호를 포함하면 안 되며 호출할 함수의 매개변수를 지정해서는 안됩니다. 예를 들어 functionName() 또는 functionName( param ) 이 아닌 functionName 을 사용합니다.
delay: Number - 함수를 실행할 때까지 대기할 지연 시간(밀리초 다위)입니다.
.... arguments - 선택 요소로서 closure 함수로 전달할 인수 목록입니다.
반환값 null - 예약된 프로세스의 고유 숫자 식별자입니다.
-
- window의 open(), close() method를 이용하면 새 윈도우를 열고, 닫을 수 있음 <xmp></xmp> open("URL", "창이름", "창의 특성");
- "창의 특성"은 ,로 구분함
- toolbar : 툴바를 생성
- menubar : 메뉴바를 생성
- status : 상태바를 생성
- scrollbars : 스크롤바를 생성
- resizable : 윈도우의 크기를 사용자가 조절
- location : 문서의 위치 정보 생성
- width : pixel 단위로 윈도우의 폭을 지정
- height : pixel 단위로 윈도우의 높이를 지정
location 객체
- URL, 파일 이름, 위치 등 브라우저에 보이는 문서에 대한 정보를 제공함
속성 역할 defaultStatus 상태바에 나타날 기본값 설정 href 문서의 URL 표시 host URL 주소의 호스트와 포트 표시 hostname 호스트와 domain 이름 표시 pathname URL 중 디렉토리 경로 표시 protocol 프로토콜의 종류 표시 hash ahchor 표시 port 포트 번호 표시 search 검색과 관련된 부분을 표시 method 역할 reload() 현재 URL을 다시 로드; 웹브라우저의 새로고침과 동일한 기능을 수행 replace() 현재 URL은 저장하고, 새로운 URL 로드
history 객체
- 브라우저의 히스토리 목록을 사용할 수 있게 해주는 객체
속성 역할 length 히스토리 목록에 개수 표시 method 역할 back() 현재 위치에서 한 단계 앞으로 진행 forward() 현재 위치에서 한 단계 뒤로 진행 go(위치값) 위치값에 명시된 만큼 앞뒤로 진행
document 객체
- window 객체 바로 밑에 있으면서 문서와 관련된 기본 기능을 제공해주는 객체
속성 역할 alinkColor <body> 태그의 alink 속성을 반환 vlinkColor <body> 태그의 vlink 속성을 반환 linkColor <body> 태그의 link 속성을 반환 bgColor <body> 태그의 bgcolor 속성을 반환 fgColor <body> 태그의 text 속성을 반환 anchors 문서 내에 있는 모든 anchor를 모아놓은 변수. 배열로 지정되어 있기 때문에 0부터 시작하는 인덱스를 사용하여 각각의 정보에 접근할 수 있음 applets 문서 내에 있는 모든 applet 객체들을 포함하는 배열 cookie 현재 문서의 인증을 저장하기 위한 쿠키 값 지정 embeds 문서 내에 있는 모든 플러그인 객체를 포함하는 배열 forms 문서 내에 있는 모든 입력 양식을 포함하는 배열 images 문서 내에 있는 모든 이미지 객체를 포함하는 배열 lastModified 문서 수정이 최후로 일어난 날짜 지정. 날짜가 Date 객체가 아닌 문자열로 반환됨 layer 문서에 있는 레이어를 배열로 지정 links 문서 안에 있는 모든 link 객체들의 배열 referer 현재 문서를 호출한 문서의 URL을 반환 title <title> 태그로 지정된 문서의 이름 method 역할 open() 문서 열기 (window.open()과 다름). 지정된 윈도우에 데이터를 보낼 준비를 하거나 데이터를 모두 보냈다는 것을 알리기 위해 사용 close() document.open()으로 열린 문서를 닫아줌 write() open()으로 열린 문서에 문자열 출력 writeln() write()와 동일하며, 줄바꾸기 문자를 함께 출력함 getSelection 현재 선택된 문자열들을 되돌려 줌 event handler 역할 onLoad 문서를 로딩할 때 발생하는 이벤트 처리 onUnload 현재 문서를 빠져나갈 때 발생하는 이벤트 처리 onFocus 문서가 포커스를 얻는 순간에 발생하는 이벤트 처리 onBlur 문서가 포커스를 잃는 순간 발생하는 이벤트 처리 onClick 문서에서 마우스 버튼을 클릭했을 때 발생하는 이벤트 처리, event 객체를 선언해야 함 onDblClick 문서에서 마우스 버튼을 더블클릭했을 때 발생하는 이벤트 처리, event 객체를 선언해야 함 onKeyDown 문서에 키를 입력한 경우 onKeyPress 키보드에서 키를 눌린 경우 onKeyUp 키보드에서 키를 눌렀다 놓았을 경우 onMouseDown 마우스 버튼을 누른 경우 onMouseUp 마우스 버튼을 눌렀다 놓은 경우
- 문서의 기본 색상 지정(alinkColor, vlinkColir, linkColor, bgColor, fgColor ) <xmp></xmp>
- 문서 연결(anchor, link)
- 쿠키(cookie)
- 웹의 가장 큰 맹점은 상태 유지를 제대로 못하는 것임.
불특정 다수가 접속하는 서버에서 누가 언제 어느 때 접속했는지 특별하게 구분할 방법이 없음. 따라서 어떤 요청이 실제 이루어졌을 때 그 요청에 대한 서버의 상태값을 클라이언트쪽에 저장시켜 다음 요청 때 클라이언트에 저장한 값을 다시 웹서버 쪽으로 전달함으로써 상태를 유지할 수 있으며, 이러한 상태 저장 방법을 쿠키(cookie)라고 함. - document 객체는 쿠키를 이용함으로써 사용자는 자신의 정보를 계속해서 여러번 입력하는 번거로움을 해소할 수 있음.
- setCookie()는 정보를 저장하는 method이며, getCookie()는 해당 정보를 찾아서 보여주는 method임
- windows 폴더 밑에 있는 cookies 폴더를 확인 요망
- cookie의 구조 <xmp></xmp> name=VALUE; expries=DATE; path=PATH; domain=DOMAIN; secure
속성설명
name=VALUE set-Cookie인지를 식별하기 위해 사용, 그러므로 항상 있어야 함 expries=DATE 쿠키가 사용될 수 있는 유효기간 설정
(365 * 24 * 60 * 60 * 1000)로 설정하는 경우의 예를 들어 설명하자면 1년=(365일 * 24시 * 60분 * 60초 * 1000)이다. getTime()과 setTime()메소드는 1/1000 단위로 시간을 계산한다. 그러므로 1000이 1초가 된다. 여기서 1달로 설정하려면 다음과 같이 하면 된다.
(30 * 24 * 60 * 60 * 1000) 즉 30일로 넣어주면 된다.path=PATH 저장된 쿠키의 URL 경로 설정 domain=DOMAIN 저장된 쿠키와 일치하는 URL 경로의 도메인 부분 설정 secure 데이터를 전송할 때의 보안 여부를 True나 False로 설정
- 웹의 가장 큰 맹점은 상태 유지를 제대로 못하는 것임.
image 객체
- html 문서의 image를 다루기 위한 객체
속성 역할 border <image>의 border 속성 반환 complete image 전송이 완료된 경우 true 값을 가짐 height <image>의 height 속성 반환 width <image>의 width 속성 반환 hspace <image>의 hspace 속성 반환 vspace <image>의 vspace 속성 반환 name <image>의 name 속성 반환 lowsrc <image>의 lowsrc 속성 반환
lowsrc : 웹브라우저가 먼저 읽어들일 낮은 해상도의 이미지를 지정src <image>의 src 속성 반환 event handler 역할 onAbort 사용자가 웹브라우저의 중지 버튼을 눌러 이미지의 전송을 중지시켰을 때 발생 onError 이미지 전송 중 에러가 발생한 경우 onLoad 이미지가 웹브라우저 화면에 로딩된 경우
link 객체
- 하이퍼텍스트를 다루기 위한 객체
- 사용법 : <xmp></xmp> document.links[index].propertyName
속성 역할 href 전체 URL 주소 hash URL 주소의 anchor 이름 host URL 주소에서 "hostname:port" 부분 hostname URL 주소의 호스트와 도메인 이름 port URL 주소중 포트 번호 protocol URL 주소 중에서 프로토콜 종류 pathname URL 주소의 절대 디렉토리 부분 search URL 주소 중에서 검색 부분 target <A> 태그의 target 속성
href 속성이 가리키는 정보를 보여줄 윈도우나 프레임을 지정event handler 역할 onClick 마우스로 링크를 클릭했을 때 실행되는 event handler onMouseOver 마우스로 링크 위를 지나갈 때 실행되는 event handler onMouseOut 마우스가 링크 밖으로 나갔을 때 실행되는 event handler
anchor 객체
- HTML 문서에 들어 있는 모든 표식에 대한 정보를 제공
frame 객체
- 서로 독립적인 별개의 문서들을 한 화면에 보여주는 창
- 사용법 <xmp></xmp> [windowReference.]frameName.propertyName [windowReference.]frames[index].propertyName
속성 역할 name <frame> tag의 name 속성을 반환 length frame 안에 포함된 frame의 갯수를 반환 parent 현재 frame을 포함하고 있는 상위 윈도우나 frame을 가리킴 self 자기 자신 frame을 가리킴 frames frame 안에 포함된 모든 frame이 포함된 배열 event handler 역할 onFocus frame이 focus를 얻은 경우 실행되는 event handler onBlur frame이 focus를 잃은 경우 실행되는 event handler
