screen 객체
: screen은 브라우저가 실행되는 스크린 장치에 관한 정보를 담고 있는 객체이다.
screen객체는 다음과 같이 점근한다
window.screen 혹은 screen
screen 객체의 프로퍼티
| availHeight | 작업 펴시줄 등을 제외하고 브라우저가 출력 가능한 영역의 높이 |
| availWidth | 작업 표시줄 등을 제외하고 브라우저가 출력가능한 영역의 폭 |
| pixelDepth | 한 픽셀의 색을 나타내기 위해 사용되는 비트수 |
| colorDepth | 한 픽샐의 색을 나타내기 위해 사용되는 비트 수로서 pixelDepth와 동일. 대부분의 브라우저에서 지원되므로 pixelDepth 보다 colorDepth를 사용할것을 권장 |
| height | 스크린의 수직 픽셀수 |
| width | 스크린의 수평 픽셀수 |
history 객체
: history 객체는 사용자가 방문한 웹 페이지의 리스트, 즉 히스토리 정보를 담고 있는 객체로 다음과 같이 접근한다.
window.history 혹은 history
history.back(); 또는 history.go(-1); // 이전페이지로 이동
history.forward(); 또는 history.go(1); // 다음페이지로 이동
예를들어 history.go(3); 이라고하면 3만큼 다음페이지로 이동
history 객체의 프로퍼티와 메소드
| 프로퍼티 | length | 히스토리 리스트에 있는 엔트리 수 |
| 메소드 | back() | 히스토리에 있는 이전 웹 페이지로 이동. 브라우저의 <back> 버튼과 동일 |
| forward() | 히스토리에 있는 다음 웹 페이지로 이동. 브라우저의 <forward> 버튼과 동일 |
|
| go ( n ) | 히스토리에서 현재 웹페이지에서 n만큼 상대적인 웹페이지로 이동 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>window.location으로 웹 사이트 접속</title>
<script>
function load(){
var select = document.getElementById("site");
window.Location = select.options[select.selectedIndex].value;
// 현재 브라우저에 표시된 HTML 문서의 주소를 얻거나, 브라우저에서 새 문서를 불러올 때 사용 할 수 있다.
// 이객체는 window 객체의 location 프로퍼티와 document 객체의 location 프로퍼티에 같이 연결되어 있다.
// location 객체의 프로퍼티와 메소드를 이용하면, 현재 문서의 url 주소를 다양하게 해석하여 처리 할 수 있다.
}
</script>
</head>
<body>
<h3> window.location으로 웹 사이트 접속</h3>
<hr>
사이트 선택 :
<select id="site">
<option value="http://www.naver.com" selected>네이버</option>
<option value="http://www.google.com">구글</option>
<option value="http://www.microsoft.com">마이크로소프트</option>
</select>
<p></p>
<button onclick="load()">웹 사이트 접속</button>
</body>
</html>
'KH > JavaScript' 카테고리의 다른 글
| JS_JSON / location (0) | 2022.09.28 |
|---|---|
| JS_BOM(3) (0) | 2022.09.27 |
| JS_BOM (Browser Object Model) (1) | 2022.09.26 |
| JS_DOM(Document Object Model) (1) | 2022.09.22 |
| JS_ 사용자 객체(Object) 생성 (0) | 2022.09.22 |