언어/HTML&CSS&Javascript
[JS] BOM / Window 객체 / location객체
딸기맛도나쓰
2020. 8. 2. 22:32
목표
- (1번)BOM이 무엇인지 알아본다.
- (링크)의 일부를 정리함.
- (2번)Widow객체가 무엇인지 알아본다.
- (3번)Location객체가 무엇인지 알아본다.
- (링크)의 일부를 정리함.
1. BOM
- Browser Object Model
- 웹 브라우저를 제어하기 위해서 브라우저가 제공하는 객체들을 의미한다.
- BOM은 전역객체인 Window의 프로퍼티와 메소드들을 통해서 제어할 수 있다.
2. Window 객체
- 전역객체로, 모든 객체가 소속된 객체이다. 창이나 프레임을 의미한다.
- 모든 전역 Javascript 객체, 함수, 변수들은 Window 객체의 자식이 된다.
- Widow객체는 1. 식별자 window 를 통해 얻을 수 있으며, 2. 생략 가능하다.
- 객체를 만든다는 것은 결국 window객체의 프로퍼티를 만드는 것과 같다.
- 예시1 : Window 객체의 메소드인 alert를 호출하는 방법
<!DOCTYPE html>
<html>
<script>
alert('Hello world');
window.alert('Hello world');
</script>
<body>
</body>
</html>- 예시2 : 전역 변수 a에 접근하는 방법
<!DOCTYPE html>
<html>
<script>
var a = 1;
alert(a);
alert(window.a);
</script>
<body>
</body>
</html>3. Location 객체
- Location 객체는 문서의 주소와 관련된 객체로 Window 객체의 프로퍼티다. 이 객체를 이용해서 윈도우의 문서 URL을 변경할 수 있고, 문서의 위치와 관련해서 다양한 정보를 얻을 수 있다.
- 예시1 : 아래는 현재 윈도우의 문서가 위치하는 URL을 알아내는 방법이다.
console.log(location.toString(), location.href);- 예시2 : 아래 두 코드는 현재 문서를 http://naver.com으로 이동한다.
location.href = 'http://naver.com';location = 'http://naver.com';