브라우저 객체.
자바스크립트에서는 웹 페이지의 구성 요소를 객체로 정의하여 제공한다.
웹 페이지를 작성하는데 가장 기본이 되는 언어가 HTML이다. HTML의 다양한 태그들을 사용하여 웹 페이지를 작성한다. 웹 브라우저는 HTML택로 구성된 웹 페이지를 읽어 들여 분석한다. 그 결과는 바로 우리가 인터넷을
항해하면서 볼 수 있는 많은 페이지로 나타난다. 자바스크립트는 웹 페이지를 구성하는 HTML 태그의 모든
요소와 웹 브라우저를 구성하는 요소들을 객체로 재공한다. 이들 갤체는 웹 브라우저를 대상으로 이루어진 ㄱㄱ체이므로 브라우저 객체라고 한다. 브라우저 객체로 대표되는 객체에는 window 객체, document 객체, history 객체, location 객체, navigator 객체가 있다. 이들 객체들은 많은 속성과 메서드를 갖고 있다.
|
객체 |
설명 |
|
window |
창에 대한 전반적인 모든 상황을 제어하는 최상위 객체이다. 자바스크립트에서 사용되는 모든 객체는 window 객체의 하위에 존재한다. 예를들어 상태 바에 메시지를 출력하려면 window 객체로 접근해야 한다. |
|
document |
문서에 대한정보를 제어하는 객체로, 이미지나 폼을 구현할 경우 웹페이지의 문서에 출력한다. |
|
location |
주소 정보를 제어하는 객체이다. |
|
history |
웹 브라우저에 기록되어 있는 히스토리 정보를 제어하는 객체이다. |
|
navigator |
웹 브라우저의 종류를 판별해 주는 객체이다. |
이처럼 window가 최 상위 객체이기 때문에 원래대로라면,
window.document.write("출력할 글자"); ㅡㅡ> 이렇게 했었어야했는데,
모든 객체는 당연히 window객체의 하위 객체이므로 window를 생략하여 사용한다.
HTML 태그의 <img> 태그를 자바스크립트의 객체로 접근하는 방법.
<img src = "image10.gif" name = "pic">
window.document.pic.src = "image10.gif";
이미지 객체의 이름은 <img> 태그의 name 속성의 값을 사용한다. 위에선 "pic"이 이미지 객체로 사용된다.
이미지는 문서에 나타나므로 이미지 객체는 document객체의 하위 객체로 존재한다.
-----------------------------------------------------------------------------------------------------
상태 표시바에 글자를 표시하는 defaulstatus/status 속성 <브라우저 창 밑에 상태바에 나타내는거임.>
인터넷을 항해하다보면 웹 브라우저의 상태바에 다양한 형태로 메시지가 제공되는 것을 볼수 있다.
메시지가 상태바에 흘러간다든지 타이핑치듯이 글자가 나타나든지 마우스가 움직일 때마다 변하는 마우스의 위치가 상태바에 나타나는 등의 효과를 볼수 있다. 이러한 효과를 연출하기 위해서는 window 객체의 status속성을 사용해야한다.
문자열은 별도의 지시가 없는 한 상태 바에 나타나도록 할 문자열은 defaultstatus 속성에 대입한다.
창 속성을 지정하지 않으면 창의 속성이 'yes' 로 주어진다. 하나의 속성이라도 주면 나머지 속성들은
'no'로 주어진다.
|
창 속성 |
속성지정방법 |
설명 |
|
toolbar |
yes/no |
도구모임을 보여줄지 설정 |
|
location |
URL을 표시하는 주소 표시줄을 보여줄지를 설정 | |
|
status |
상태 바를 보여줄지 설정 | |
|
menubar |
메뉴 표시줄을 보여줄지를 설정 | |
|
scollbars |
스크롤 바를 보여줄지를 설정 | |
|
directories |
디렉토리 바를 보여줄지를 설정 | |
|
resizable |
창의 크기 조절 가능하게 할지를 설정 | |
|
height |
픽셀 수 |
창의 높이를 픽셀 단위로 지정 |
|
width |
창의 너비를 필셀 단위로 지정 |
----------------------------------------------------------------------------------------------------
새로운 창을 열어주는 window.open() 메서드.
홈페이지에 접속하자마자 공지 사항을 알려주는 창이 함께 출력되는것을 봤을텐데,
그게 이거다.
사용법,
window.open("연결할 URL", "창 이름" ,"창의 속성");
ex) <body onload = "window.open("news.html", "testwin","width=400, height =300 left=0, top=0, toolbar=no,
location=no, directories=no, status=no, menubar=no, resizable=no, scrollbars=no, copyhistory=no ")>
연결할 URL : 새로 만들어진 창에 로드할 웹 페이지 주소나 HTML 파일을 지정.
창 이름 : 새로 만들어진 창의 이름을 지정.
창 속성: 창의 모양이나 특징을 지정.
두 번째 매개변수인 '창 이름'을 기술하지 않으면, 마우스를 그림에 가져갈 때마다 창이 계속해서 생성됨.
------------------------------------------------------------------------------------------------------
창을 닫는 window.close() 메서드
open() 메서드에 의해 새로운 창이 열렸으면, 창을 닫는 법도 알아보자
window.close();
<form>
<input type = "button" value ="닫 기" onclick = "window.close()">
</form>
'자바스크립트' 카테고리의 다른 글
| 자바스크립트 정리 <9> (0) | 2012.08.13 |
|---|---|
| 자바스크립트 정리 <7> (0) | 2012.08.13 |
| 자바스크립트. <4> (0) | 2012.08.10 |
| 자바스크립트 정리. <3> (0) | 2012.08.10 |
| 자바스크립트 정리.<2> (0) | 2012.08.10 |