JavaScript
객체
- 내장 객체
- 브라우저 객체
- 문서 객체(DOM)
- 사용자 정의 객체
브라우저 객체 모델(Browser Object Model)
- 자바스크립트에서는 웹페이지를 구성하는 HTML 태그의 모든 요소와 웹 브라우저를 구성하는 요소들을 객체로 정의하여 제공
- 객체들을 계층구조로 분류
대표적인 브라우저 객체
- 웹 브라우저를 대상으로 이루어진 객체
- new 연산자를 통해서 생성하지 않고 그냥 사용
- ex)
document.write()
- ex)
window: 창document: 문서history 객체: 웹 브라우저 기록 정보location 객체: 주소 정보navigation 객체: 웹 브라우저 정보(종류 판별 등)
history 객체
- 최근 방문한 주소에 관한 정보를 기억하고 있는 개체
- 메소드
back(): 이전에 열었던 페이지로 이동forward(): 이전 페이지로 이동 후 다시 앞으로 이동go(): 몇 단계 뒤에 있는 페이지로 이동go(3): 3단계 앞의 페이지로 이동go(-2): 2단계 다음 페이지로 이동
location 객체
- 현재 브라우저의 주소창에 표시된 주소 값에 관련된 내용을 다루는 객체
href = URL: 지정된 URL로 페이지 이동pathname: 도메인을 제외한 실제 파일 경로assign(URL): 지정된 URL로 페이지 이동replace(URL): 현재 페이지를 URL로 대체. 이 경우에 history 기록이 남지 않음(back 버튼 적용 안됨) 최신 IE 됨reload(): 문서 내용 새로 고침
locatioin.href() 메소드 : 크롬 사용 시 지원 안됨
- 해결 -> href 속성 사용
location.href = "http://naver.com"
location 객체 예제
location.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript</title>
<script type="text/javascript">
function Move() {
location.hred = "http://www.google.com";
}
function assignMove(){
window.location.assign("http://naver.com");
}
function replaceMove() {
// 뒤로가기 적용 안됨
window.location.replace("http://youtube.com");
}
</script>
</head>
<body>
<button onclick="Move()">구글</button>
<button onclick="assignMove()">네이버</button>
<button onclick="replaceMove()">유튜브</button>
</body>
</html>navigator 객체
브라우저에 관한 정보 제공
appCodeName: 브라우저의 코드명appName: 브라우저의 종류appVersion: 브라우저의 버전cookieEnabled: 쿠키 사용 가능platform: 시스템 환경userAgent: 브라우저 기본 정보(종류/버전)systemLanguage: 시스템 언어
'Front > JavaScript' 카테고리의 다른 글
| JavaScript - 이벤트 핸들러와 이벤트 처리 (0) | 2021.12.10 |
|---|---|
| JavaScript - 문서 객체 모델(DOM) (0) | 2021.12.10 |
| JavaScript - 브라우저 객체 모델(window) (0) | 2021.12.10 |
| JavaScript - 내장함수(Math, Spring) (0) | 2021.12.09 |
| JavaScript - 내장함수(Date, Array) (0) | 2021.12.09 |
