• 회원가입
  • 로그인
  • 구글아이디로 로그인

[Window] JS - Window 객체 - 윈도우객체 (속성/메서드) 종류

  1. Window 객체 정의
  2. Window 객체 속성
  3. Window 객체 메서드

 

Window 객체 정의

 

window 객체는 브라우저에서 열린 의미.

 


 

1.

웹문서에 <iframe> 태그 포함 시, 

브라우저는 HTML 문서용 window 객체, 각각의 아이프레임용 widnow 객체 만듦.

 

2.
Window 객체에 대한 공개 표준은 없지만, 모든 주요 브라우저가 이를 지원.

 

3.

Window 객체

  • JavaScript에는 항상 전역 객체가 정의되어 있음. 
  • 프로그램이 전역 변수를 만들 때 전역 객체의 구성원으로 만들어짐. 
  • window 객체는 브라우저의 전역 객체임. 
  • 모든 전역 변수 또는 함수는 window 개체로 접근 가능함. 
  • 전역 변수를 정의한 후 window 객체에서 해당 값에 접근 가능함.
  • window 객체 사용해 동적변수 (= 가변변수 = 유동변수) 생성 가능.


 

Window 객체 속성

 

closed
창이 닫혀 있는지 여부 나타내는 참거짓 반환.

 

console 

브라우저의 콘솔에 정보를 기록하는 메소드를 제공하는 Console 객체에 대한 참조 반환 (Console 객체 참조)

 

defaultStatus 

창의 상태표시줄에 있는 기본 텍스트를 설정하거나 반환.

 

document 

윈도우의 Document 객체 반환 (Document 객체 참조).

 

frameElement

현재창이 삽입 된 <iframe> 요소 반환.

 

frames

현재창에서 모든 <iframe> 요소를 반환.

 

history

창의 History 객체를 반환. (History 객체 참조).

 

innerHeight

스크롤 바를 포함하여 창 내용 영역 (= viewport) 높이 반환.

 

innerWidth

스크롤 바를 포함하여 창 내용 영역 (= viewport) 너비 반환.

 

length

현재창에서 <iframe> 요소의 개수 반환.

 

localStorage

웹 브라우저에 key / value 쌍을 저장 가능. 만료 날짜 없는 데이터 저장.

 

location

창의 Location 객체 반환 (Location 객체 참조).

 

name

창이름 설정하거나 반환.

 

navigator

창 Navigator 객체 반환 (Navigator 객체 참조).

 

opener

창 생성한 window에 대한 참조 반환.

 

outerHeight

toolbar / scrollbar 포함해 브라우저 창 높이 반환.

 

outerWidth

toolbar / scrollbar 포함해 브라우저 창 너비 반환.

 

pageXOffset

현재 문서가 창의 왼쪽상단 구석으로부터 (가로로) 스크롤 된 픽셀 반환.

 

pageYOffset

현재의 문서가 창의 왼쪽상단 구석으로부터 (세로로) 스크롤 된 픽셀 반환.

 

parent

현재창의 부모창 반환.

 

screen

창의 screen 객체 반환 (Screen 객체 참조).

 

screenLeft

화면에 상대적인 창의 수평 좌표 반환.

 

screenTop

화면을 기준으로 한 창의 세로 좌표 반환.

 

screenX

화면을 기준으로 한 창의 가로 좌표를 반환.


screenY

화면에 상대적인 창의 세로 좌표를 반환.


sessionStorage

웹 브라우저에 key / value 쌍을 저장 가능. 하나의 세션에 대한 데이터 저장.

 

scrollX

pageXOffset의 별칭

 

scrollY

pageYOffset의 별칭

 

self

현재 창을 반환.

 

status

창의 상태표시줄에있는 텍스트를 설정하거나 반환.


top

최상위 브라우저 창을 반환.

 

 

Window 객체 메서드

 

alert()

메시지와 확인 버튼이 있는 경고 상자 표시.

 

atob()

base-64로 암호화 된 문자열을 암호해독.

 

blur()

현재 창에서 focus 제거.

 

btoa()

base-64로 문자열을 암호화.

 

clearInterval()

setInterval ()로 설정된 타이머 지우기.

 

clearTimeout()

setTimeout ()로 설정된 타이머 지우기.

 

close()

현재창 닫기.

 

confirm()

메시지와 확인 및 취소 버튼이 있는 대화상자 표시.

 

focus()

현재창에 포커스 설정.

 

getComputedStyle()

요소에 적용된 현재 계산 된 CSS 스타일 가져오기.

 

getSelection()

사용자가 선택한 텍스트 범위를 나타내는 Selection 객체를 반환.

 

matchMedia()

지정된 CSS 미디어쿼리 문자열을 나타내는 MediaQueryList 객체를 반환.

 

moveBy()

현재 위치를 기준으로 창을 이동.

 

moveTo()

창을 지정된 위치로 이동.

 

open()

새 브라우저 창 열기.

 

print()

현재 윈도우의 내용을 인쇄.

 

prompt()

방문자에게 입력을 요구하는 대화상자 표시.

 

requestAnimationFrame()

브라우저에 다음 Repaint 전에 애니메이션 업데이트하는 함수 호출하도록 요청.

 

resizeBy()

지정 픽셀 기준으로 창크기 조절.

 

resizeTo()

창을 지정 폭과 높이로 사이즈 변경.

 

scroll()

폐기예고. 이 메소드는 scrollTo () 메소드로 대체.

 

scrollBy()

지정된 픽셀수만큼 문서 스크롤.

 

scrollTo()

문서를 지정된 좌표로 스크롤.

 

setInterval()

지정된 간격 (밀리 초)으로 함수 호출하거나 표현식을 평가.

 

setTimeout()

지정된 밀리 초 후에 함수를 호출하거나 표현식을 평가.

 

stop()

창 로드 정지.

 

※ Reflow : 크기와 위치에 맞게 브라우저에 배치하는 과정.

※ Repaint : Reflow 과정 끝난 후 재생성된 렌더 트리를 다시 그리는 과정.

 관련글 https://heowc.tistory.com/83

 

방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

분류 제목
Math JS - Math.min() 메서드 ★ - 최소값 (= 최솟값 = Math.min메서드 = 매스민메서드)
Math JS - Math.pow() 메서드 ★ - 승수 (= 거듭제곱 = pow메서드 = 매스포우메서드/매스파워메서…
Math JS - Math.random() 메서드 ★ - 랜덤값 (= 임의값 = Math.random메서드 = 매스랜…
Math JS - Math.round() 메서드 ★ - 반올림 (= 라운드)
Math JS - Math.sin() 메서드 - 사인값
Math JS - Math.sqrt() 메서드 - 제곱근
Math JS - Math.tan() 메서드 - 탄젠트값
Date JS - Date 객체 - 날짜객체 (속성 + 메서드) 종류 ※Date()함수 = Date함수 = 데이트 함…
Date JS - constructor 속성 - 객체생성자함수 (날짜 경우)
Date JS - prototype 속성(날짜) - 사용자정의 속성/메서드 추가 (날짜객체경우 = 프로토타입)
Date JS - getDate() 메서드 ★ - 일자 얻기 (= getDate메서드 = 겟데이트)
Date JS - getDay() 메서드 - 요일 얻기 (예: 4) (= 요일 추출 = 요일 표시 = getDay메서…
Date JS - getFullYear() 메서드 - 년도 (= 4자리 전체년도얻기 = 겟풀이어)
Date JS - getHours() 메서드 - 시 (= 시얻기 = 시간얻기)
Date JS - getMilliseconds() 메서드 - 밀리초 (= 밀리세컨드)
Date JS - getMinutes() 메서드 - 분 (= 분얻기)
Date JS - getMonth() 메서드 - 월얻기 (= 달얻기 = 달월얻기 = getMonth메서드 = 겟먼스메…
Date JS - getSeconds() 메서드 - 초 얻기 (= 겟세컨즈메서드)
Date JS - getTime() 메서드 ★ - 시간 얻기 (= 타임스탬프얻기 = getTime메서드 = 겟타임메서…
Date JS - getTimezoneOffset() 메서드 - UTC시간과의 시차
11/67
목록
찾아주셔서 감사합니다. Since 2012