기록과 정리의 공간

[JS] BOM / Window 객체 / location객체 본문

언어/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);
location.href = 'http://naver.com';
location = 'http://naver.com';
저작자표시 비영리

'언어 > HTML&CSS&Javascript' 카테고리의 다른 글

[HTML] form태그 enctype 속성 / input태그 multiple 속성  (0) 2021.01.11
[JQuery] ajax settings 일부 정리  (0) 2021.01.04
[JS] HTML DOM Elements  (0) 2020.08.02
'언어/HTML&CSS&Javascript' Related Articles more
Comments