|
|
Browser Object Model -history |
history 객체
작업을 함에 있어서 history하면 다들 떠오리시는게 작업내역일 거에요.
작업내용을 통해서, undo를 할 수 있거나 즉, 이전 작업내용으로 되돌아 갈 수 있는데요,
이는 그러한 작업 내역들이 메모리에 저장되기 때문입니다.
자바스크립트에서의 history 객체는 히스토리 스택(history stack)-메모리-내에 사용자가 열어본 페이지를 저장합니다.
스택구조는 마지막에 들어온것이 가장먼저 나오는것으로 LIFO(Last-In First-Out, 후입선출)이라고 합니다.
그렇기 때문에 이 history 객체를 이용해서 페이지를 이동시에, 가장 최근에 열어본 페이지로 이동할 수 있는거죠.
여기서 사용가능한 프로퍼티와 메소드는 다음과 같습니다.
더 있긴 하지만, 더이상 잘 쓰이지 않기 때문에 생략하겠습니다.
|
Properties |
|
| length | 히스토리 스택에 저장되어 있는 페이지 수를 나타냅니다. |
|
Methods |
|
|
go(정수) |
정수만큼 이동합니다. 음의정수(-)의 경우 이전페이지로 검색합니다. |
|
back() |
이전 페이지로 돌아가며 go(-1)과 동일합니다. |
|
forward() |
다음 페이지로 넘어가며 go(1)과 동일합니다. |
그렇다면 다음 예제를 통해 위의 프로퍼티와 메소드를 사용해 보도록 할게요.
<HTML>
<HEAD><TITLE>자바스크립트를 활용한 메시지창 띄우기</TITLE>
<SCRIPT language="JavaScript">
function history_back(){
history.back();
}
function history_forward(){
history.forward()
}
function history_go(){
var page=document.frm.txtGo.value;
history.go(page);
}
</SCRIPT>
</HEAD>
<BODY>
<FORM name=frm>
<INPUT type='button' value='back' onclick=history_back()>
<INPUT type='button' value='forward' onclick=history_forward()>
<br>히스토리에 저장되어 있는 페이지의 수 : <script>document.write(history.length);</script>
<br>이동하고 싶은 전페이지의 수(입력) : <INPUT type='text' name='txtGo' value='-2' size="4">
<INPUT type='button' value='go' onclick=history_go()>
</FORM>
</BODY>
</HTML>
[실 행]
참고로 위의 Go 예제를 제대로 해보실려면 여러곳을 방문하고 이 페이지로 오셔야 제대로 된 테스트를 진행하실 수 있구요.
forward의 경우 잠시 다른 페이지 가셨다가 되돌아오시면 바로 테스트 가능합니다. ^^
|
궁금하시거나 도움줄 말이 있으시면 댓글 부탁드립니다 ^^ |
'프로그래밍 > JavaScript' 카테고리의 다른 글
| [자바스크립트] 'alert', 메시지 창을 띄우자! (4) | 2012.06.18 |
|---|---|
| [자바스크립트] 'defaultStatus', 상태표시줄에 텍스트를 띄우자! (1) | 2012.06.18 |
| [자바스크립트] 'Date' 개체, 날짜와 시간값을 얻어봅시다! (0) | 2012.06.17 |
| [자바스크립트] 'prompt', 프롬프트창을 띄워봅시다! (0) | 2012.06.17 |
| [HTML] 버튼(button)을 만들어서 사용해 보자! (1) | 2012.01.07 |
