recursal/MDN huggingface dataset:
Window.getSelection()
=====================

요약
--

사용자 또는 Caret의 위치에 따라 선택된 텍스트의 범위를 나타내는 `Selection` (en-US) 객체를 반환한다.

문법
--


```js
selection = window.getSelection();
```


* selection은 `Selection` (en-US) 객체입니다. 빈 문자열("")을 추가하거나 `Selection.toString()` (en-US)을 호출하면 선택된 text를 반환합니다.
예제
--


```js
function foo() {
  var selObj = window.getSelection();
  alert(selObj);
  var selRange = selObj.getRangeAt(0);
  // do stuff with the range
}
```

노트
--

### Selection 객체의 문자열 표현

JavaScript에서 문자열을 인자로 받는 함수(`window.alert()` 나 `document.write()` (en-US) 같은)에 객체를 전달하면 해당 객체의 `toString()` 메소드를 호출하고 그 결과를 호출한 함수로 전달합니다. 이를 통해서 실제로는 속성과 메소드를 갖는 문자열이 아닌 일반적인 객체라 하더라도 문자열을 인자로 받는 함수의 인자로 사용할 때에는 객체를 문자열인 것처럼 전달할 수 있습니다.

위 예제에서 selObj를 `window.alert()`의 인자로 전달하면 `selObj.toString()`가 자동적으로 호출됩니다. 하지만, selObj에 대해서 `length` 나 `substr` 같은 JavaScript String의 속성이나 메소드를 사용하면 객체에 그러한 속성이나 메소드가 없기 때문에 에러나 예상치 못한 결과가 발생합니다. `Selection` 객체를 문자열로 사용하려면 다음처럼 직접 `toString()` 메소드를 호출해야 합니다:


```js
var selectedText = selObj.toString();
```

* `selObj`는 `Selection` 객체입니다.
* `selectedText`는 문자열 (선택한 문자열)입니다.
### Related objects

It's also useful to note that you can call `Document.getSelection()`, which works identically.

HTML inputs provide simpler helper APIs for working with selection (see `HTMLInputElement.setSelectionRange()` (en-US)).

Notice the difference between *selection* and *focus*. `Document.activeElement` returns the focused element.

명세서
---

| Specification |
| --- |
| Selection API # dom-window-getselection |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `Selection` (en-US)
* `Range`
* `Document.getSelection()`
* `HTMLInputElement.setSelectionRange()` (en-US)
* `Document.activeElement`, `HTMLElement.focus()` (en-US), and `HTMLElement.blur()` (en-US)
Window.scrollBy()
=================

**`Window.scrollBy()`** 메서드는 창에 있는 문서를 지정된 양만큼 스크롤합니다.

구문
--


```js
scrollBy(x-coord, y-coord)
scrollBy(options)
```

### 매개변수

* `x-coord`는 스크롤할 수평 픽셀 값입니다.
* `y-coord`는 스크롤할 수직 픽셀 값입니다.

- 혹은 -

`options`

다음 매개변수가 포함된 사전.

`top`

창 또는 요소를 스크롤할 Y축을 따라 픽셀 수를 지정합니다.

`left`

창 또는 요소를 스크롤할 X축을 따라 픽셀 수를 지정합니다.

`behavior`

스크롤이 부드럽게 애니메이션되는지 (`smooth`), 한 번의 점프로 즉시 실행되는지 (`instant`), 또는 브라우저가 선택하도록 할지 (`auto`, 기본)를 지정합니다.


### 반환 값

없음 (`undefined`).

예제
--

한 페이지 아래로 스크롤하려면.


```js
window.scrollBy(0, window.innerHeight);
```


위로 스크롤하려면.


```js
window.scrollBy(0, -window.innerHeight);
```


`options` 사용.


```js
window.scrollBy({
  top: 100,
  left: 100,
  behavior: "smooth",
});
```

참고
--

`window.scroll()`가 문서의 절대 위치로 스크롤하는데 반해, `window.scrollBy()`는 특정 양만큼 스크롤합니다.
 `window.scrollByLines()` (en-US)와 `window.scrollByPages()` (en-US)를 참조하십시오.

명세서
---

| Specification |
| --- |
| CSSOM View Module # dom-window-scrollby |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
Window.frameElement
===================

**`Window.frameElement`** 속성은 `<iframe>` (en-US)이나 `<object>`처럼 현재 창을 포함한 요소를 반환합니다. 창이 다른 문서에 포함된 것이 아니거나, 문서의 출처가 다른 경우, 즉 창과 해당 문서의 도메인이 서로 다른 경우 `null`을 반환합니다.

**참고:** 속성 이름("frame")과는 달리, `<object>`, `<iframe>` (en-US), `<embed>`를 포함한 모든 포함 지점에서 사용할 수 있습니다.

예제
--


```js
var frameEl = window.frameElement;
// If we're embedded, change the containing element's URL to 'http://mozilla.org/'
if (frameEl) {
  frameEl.src = "http://mozilla.org/";
}
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-frameelement-dev |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `window.frames` (en-US)는 현재 창의 모든 자식 프레임을 배열형 객체로 나열합니다.
* `window.parent` (en-US)는 부모 창, 즉 `frameElement`를 담고 있는 창을 반환합니다.
Window: copy 이벤트
================

**`copy`** 이벤트는 사용자가 브라우저의 사용자 인터페이스를 통해 복사했을 때 발생합니다.

|  |  |
| --- | --- |
| 버블링 | 예 |
| 취소 가능 | 예 |
| 인터페이스 | `ClipboardEvent` |
| 이벤트 처리기 속성 | `oncopy` (en-US) |

`copy` 이벤트의 원 대상은 복사 동작의 대상인 `Element` (en-US)입니다. `Window`에서 수신할 경우 캡처 또는 버블링 단계의 이벤트를 받게 됩니다. 이벤트에 대한 자세한 정보는 Element: copy 이벤트에서 확인하세요.

예제
--


```js
window.addEventListener("copy", (event) => {
  console.log("복사 동작 실행");
});
```

명세
--

| Specification |
| --- |
| Clipboard API and events # clipboard-event-copy |
| HTML Standard # handler-oncopy |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* 관련 이벤트: `cut`, `paste`
* `Element` (en-US)를 대상으로 한 같은 이벤트: `copy`
* `Document`를 대상으로 한 같은 이벤트: `copy`
Window.self
===========

**`Window.self`** 읽기전용 속성은 자기 자신을 `WindowProxy`로써 반환합니다. `window.self`로도 사용할 수 있고, `self`만 독립적으로 사용해 접근할 수 있습니다. 독립적으로 접근했을 때의 이점은 비 `Window` 환경인 웹 워커 등도 비슷한 표기법을 사용한다는 것입니다. 이 때 `self`는 `Window` 문맥에서는 `window.self`, 워커 문맥에서는 `WorkerGlobalScope.self` (en-US)와 같습니다.

예제
--

아래와 같이 쓴 `window.self`는 그냥 `window`로 바꿨을 때와 동일합니다.


```js
if (window.parent.frames[0] != window.self) {
  // this window is not the first frame in the list
}
```


이에 더해 브라우징 문맥의 현재 활성확된 문서에서는 `window`가 현재 전역 객체를 가리키므로 다음 네 줄의 코드는 모두 동일합니다.


```js
var w1 = window;
var w2 = self;
var w3 = window.window;
var w4 = window.self;
// w1, w2, w3, w4 모두 일치. 그러나 워커에서는 w2만 작동함
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-self-dev |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Worker`에서 같은 역할을 하는 `WorkerGlobalScope.self` (en-US).
Window.navigator
================

**`Window.navigator`** 읽기 전용 속성은 스크립트를 구동 중인 애플리케이션에 대한 메서드와 속성을 가진 `Navigator` 객체의 참조를 반환합니다.

값
-

`navigator` 객체.

예제
--

### 예제 1: 브라우저를 감지하고 그 이름을 문자열로 반환하기


```js
function getBrowserName(userAgent) {
  // 여기서는 순서가 중요하며, 목록에 없는 브라우저는 거짓 양성이 될 수 있습니다.

  if (userAgent.includes("Firefox")) {
    // "Mozilla/5.0 (X11; Linux i686; rv:104.0) Gecko/20100101 Firefox/104.0"
    return "Mozilla Firefox";
  } else if (userAgent.includes("SamsungBrowser")) {
    // "Mozilla/5.0 (Linux; Android 9; SAMSUNG SM-G955F Build/PPR1.180610.011) AppleWebKit/537.36 (KHTML, like Gecko) SamsungBrowser/9.4 Chrome/67.0.3396.87 Mobile Safari/537.36"
    return "Samsung Internet";
  } else if (userAgent.includes("Opera") || userAgent.includes("OPR")) {
    // "Mozilla/5.0 (Macintosh; Intel Mac OS X 12\_5\_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.0.0 Safari/537.36 OPR/90.0.4480.54"
    return "Opera";
  } else if (userAgent.includes("Edge")) {
    // "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36 Edge/16.16299"
    return "Microsoft Edge (Legacy)";
  } else if (userAgent.includes("Edg")) {
    // "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.0.0 Safari/537.36 Edg/104.0.1293.70"
    return "Microsoft Edge (Chromium)";
  } else if (userAgent.includes("Chrome")) {
    // "Mozilla/5.0 (X11; Linux x86\_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.0.0 Safari/537.36"
    return "Google Chrome or Chromium";
  } else if (userAgent.includes("Safari")) {
    // "Mozilla/5.0 (iPhone; CPU iPhone OS 15\_6\_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.6 Mobile/15E148 Safari/604.1"
    return "Apple Safari";
  } else {
    return "알려지지 않은 브라우저";
  }
}

const browserName = getBrowserName(navigator.userAgent);
console.log(`당신이 사용중인 브라우저는 ${browserName}입니다.`);
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-navigator |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
orientationchange
=================

`orientationchange` 이벤트는 장치의 방향이 바뀔 때 호출 된다.

General info
------------

Specification

Screen Orientation

Interface

Event

Bubbles

No

Cancelable

No

Target

Screen

Default Action

None

Properties
----------

| Property | Type | Description |
| --- | --- | --- |
| `target` 읽기 전용 | `EventTarget` | The event target (the topmost target in the DOM tree). |
| `type` 읽기 전용 | `DOMString` | The type of event. |
| `bubbles` 읽기 전용 | `Boolean` | Whether the event normally bubbles or not. |
| `cancelable` 읽기 전용 | `Boolean` | Whether the event is cancellable or not. |

Example
-------


```js
// Note that "orientationchange" and screen.orientation are unprefixed in the following
// code although this API is still vendor-prefixed browsers implementing it.
screen.addEventListener("orientationchange", function () {
  alert("the orientation of the device is now " + screen.orientation);
});
```
Window.opener
=============

`Window` 인터페이스의 **`opener`** 속성은 `open()` (en-US)을 사용해 현재 창을 열었던 창의 참조를 반환합니다.

예제로 설명하자면, 창 `A`가 창 `B`를 열었을 때 `B.opener`는 `A`를 반환합니다.

구문
--


```js
const openerWindow = window.opener;
```

### 값

`window.open()` (en-US)을 사용하거나 `target` 특성을 지정한 링크로 현재 창을 연 `Window`. 현재 창이 다른 창에 의해 생성됐거나 링크로 열리지 않았다면 `null`.

최근 브라우저에서는 `<a>` 요소에 `rel="noopener noreferrer"` 특성을 지정하면 `window.opener` 참조 설정을 방지합니다. 따라서 생성된 창의 `opener` 속성에 접근해도 `null`을 반환합니다.

명세
--

| Specification |
| --- |
| HTML Standard # dom-opener-dev |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
WindowEventHandlers.onhashchange
================================

`WindowEventHandlers` 믹스인의 **WindowEventHandlers.onhashchange** 속성은
**hashchange** 이벤트를 처리하기 위한 `event handler` 입니다.

hashchange 이벤트는 윈도우의 해시가 변경되면 시작됩니다. ( `Window.location` (en-US) 및 `HTMLHyperlinkElementUtils.hash` (en-US) 참조)

문법
--

**event handler:**


```js
window.onhashchange = funcRef;
```


**HTML event handler:**


```html
<body onhashchange="funcRef();"></body>
```


**event listener:**

`addEventListener()`를 사용하여 이벤트 리스너 추가하기


```js
window.addEventListener("hashchange", funcRef, false);
```

### 매개변수

`funcRef`

함수에 대한 참조.

예제
--

### event handler 사용하기

This example uses an event handler (`window.onhashchange`) to check the new hash value whenever it changes. If it equals `#cool-feature`, the script logs a message to the console.


```js
function locationHashChanged() {
  if (location.hash === "#cool-feature") {
    console.log("You're visiting a cool feature!");
  }
}

window.onhashchange = locationHashChanged;
```

### Using an event listener

이 예제는 이벤트 리스너를 사용하여 해시가 변경 될 때마다 콘솔에 알림표시합니다.


```js
function hashHandler() {
  console.log("The hash has changed!");
}

window.addEventListener("hashchange", hashHandler, false);
```

### Overriding the hash

이 함수는 새로운 해시를 동적으로 설정하여 임의로 두 값 중 하나로 설정합니다.


```js
function changeHash() {
  location.hash = Math.random() > 0.5 ? "location1" : "location2";
}
```

hashchange 이벤트
--------------

`hashchange` 이벤트에는 다음과 같은 필드가 있습니다:

| Field | Type | Description |
| --- | --- | --- |
| `newURL` | `DOMString` | 탐색할 새로운 URL입니다. |
| `oldURL` | `DOMString` | 탐색했던 이전의 URL입니다. |

### 제2의 해결책을 위한 event.newURL 와 event.oldURL


```js
//let this snippet run before your hashchange event binding code
if (!window.HashChangeEvent)
  (function () {
    var lastURL = document.URL;
    window.addEventListener("hashchange", function (event) {
      Object.defineProperty(event, "oldURL", {
        enumerable: true,
        configurable: true,
        value: lastURL,
      });
      Object.defineProperty(event, "newURL", {
        enumerable: true,
        configurable: true,
        value: document.URL,
      });
      lastURL = document.URL;
    });
  })();
```

명세
--

| Specification |
| --- |
| HTML Standard # event-hashchange |
| HTML Standard # handler-window-onhashchange |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `hashchange` event
* Manipulating the browser history (en-US)
* `history.pushState()` and `history.replaceState()` (en-US) methods
* `WindowEventHandlers.onpopstate`
* `HTMLHyperlinkElementUtils.hash` (en-US)
window.cancelAnimationFrame()
=============================

**`window.cancelAnimationFrame()`** 메소드는 이전에 `window.requestAnimationFrame()` 을 호출하여 스케줄된 애니메이션 프레임 요청을 취소합니다.

구문
--


```js
window.cancelAnimationFrame(requestID);
```

### Parameters

`requestID`

요청된 콜백 `window.requestAnimationFrame()` 을 호출하여 반환된 ID 값.

예시
--


```js
var requestAnimationFrame =
  window.requestAnimationFrame ||
  window.mozRequestAnimationFrame ||
  window.webkitRequestAnimationFrame ||
  window.msRequestAnimationFrame;

var cancelAnimationFrame =
  window.cancelAnimationFrame || window.mozCancelAnimationFrame;

var start = window.mozAnimationStartTime; // Firefox 에서만 지원됨. 다른 브라우저에서는 Date.now() 같은 것을 사용할 수 있음.

var myReq;

function step(timestamp) {
  var progress = timestamp - start;
  d.style.left = Math.min(progress / 10, 200) + "px";
  if (progress < 2000) {
    myReq = requestAnimationFrame(step);
  }
}
myReq = requestAnimationFrame(step);

cancelAnimationFrame(myReq);
```

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

명세
--

| Specification |
| --- |
| HTML Standard # animationframeprovider-cancelanimationframe |

함께 보기
-----

* `window.mozAnimationStartTime` (en-US)
* `window.requestAnimationFrame()`
Window.matchMedia()
===================

**`Window.matchMedia()`** 메서드는 주어진 미디어 쿼리 문자열의 분석 결과를 나타내는 `MediaQueryList` (en-US) 객체를 반환합니다.

구문
--


```js
window.matchMedia(mediaQueryString);
```

### 매개변수

`mediaQueryString`

분석할 미디어 쿼리를 나타내는 문자열.

### 반환 값

주어진 미디어 쿼리에 대한 `MediaQueryList` (en-US) 객체,

예제
--

다음 예제는 화면이 매우 좁을 때 다른 작업을 수행합니다.


```js
if (window.matchMedia("(min-width: 400px)").matches) {
  /\* 뷰포트 너비가 400 픽셀 이상 \*/
} else {
  /\* 뷰포트 너비가 400 픽셀 미만 \*/
}
```


더 많은 예제는 Testing media queries programmatically (en-US)를 참고하세요.

명세
--

| Specification |
| --- |
| CSSOM View Module # dom-window-matchmedia |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* 미디어 쿼리 사용하기
* Using media queries from code (en-US)
* `MediaQueryList` (en-US)
* `MediaQueryListListener` (en-US)
Window: paste 이벤트
=================

**`paste`** 이벤트는 사용자가 브라우저의 사용자 인터페이스를 통해 붙여넣기를 했을 때 발생합니다.

|  |  |
| --- | --- |
| 버블링 | 예 |
| 취소 가능 | 예 |
| 인터페이스 | `ClipboardEvent` |
| 이벤트 처리기 속성 | `onpaste` (en-US) |

`paste` 이벤트의 원 대상은 붙여넣기 동작의 대상인 `Element` (en-US)입니다. `Window`에서 수신할 경우 캡처 또는 버블링 단계의 이벤트를 받게 됩니다. 이벤트에 대한 자세한 정보는 Element: paste 이벤트에서 확인하세요.

예제
--


```js
window.addEventListener("paste", (event) => {
  console.log("붙여넣기 동작 실행");
});
```

명세
--

| Specification |
| --- |
| Clipboard API and events # clipboard-event-paste |
| HTML Standard # handler-onpaste |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* 관련 이벤트: `copy`, `cut`
* `Element` (en-US)를 대상으로 한 같은 이벤트: `paste`
* `Document`를 대상으로 한 같은 이벤트: `paste`
Window.closed
=============

**`Window.closed`** 읽기 전용 속성은 참조한 창이 닫혔는지 여부를 나타냅니다.

구문
--


```js
const isClosed = windowRef.closed;
```

### 값

창이 닫혔으면 `true`, 그렇지 않으면 `false`.

예제
--

### 팝업에서 자신을 띄운 창의 URL 바꾸기

다음 예제는 팝업 창에서 자신을 띄운 창의 URL을 바꾸는 예제입니다. URL을 바꾸기 전, 현재 창을 띄운 창의 존재 유무를 `window.opener` 속성으로 검사하고, `closed` 속성으로 이미 닫히지는 않았는지도 검사합니다.


```js
// Check that an opener exists and is not closed
if (window.opener && !window.opener.closed) {
  window.opener.location.href = "http://www.mozilla.org";
}
```


**참고:** 팝업은 자신을 띄운 창에만 접근할 수 있습니다.

### 이전에 열었던 팝업 새로고침

이번 예제의 `refreshPopupWindow()`는 팝업의 `reload()` 메서드를 호출해 데이터를 다시 불러옵니다. 만약 팝업을 아직 열지 않았거나, 사용자가 이미 닫은 경우 새로운 팝업을 띄웁니다.


```js
const popupWindow = null;

function refreshPopupWindow() {
  if (popupWindow && !popupWindow.closed) {
    // popupWindow is open, refresh it
    popupWindow.location.reload(true);
  } else {
    // Open a new popup window
    popupWindow = window.open("popup.html", "dataWindow");
  }
}
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-window-closed-dev |
Window.scroll()
===============

**`Window.scroll()`** 메서드는 문서 내 창을 특정 위치로 스크롤합니다.

구문
--


```js
scroll(x-coord, y-coord)
scroll(options)
```

### 매개변수

* `x-coord`는 왼쪽 상단에 표시하고 싶은 문서의 수평축에 따른 픽셀입니다.
* `y-coord`는 왼쪽 상단에 표시하고 싶은 문서의 수직축에 따른 픽셀입니다.

- 혹은 -

`options`

다음 매개변수를 포함하는 사전.

`top`

창이나 요소를 스크롤할 Y축의 픽셀의 수를 지정합니다.

`left`

창이나 요소를 스크롤할 X축의 픽셀의 수를 지정합니다.

`behavior`

요소를 위치로 스크롤하는 브라우저는 다음 스크롤 동작 중 하나를 가질 수 있습니다.

* `auto` (기본): 스크롤 동작은 스크롤 요소에 의해 설정되거나 상속된 `scroll-behavior` (en-US) CSS 스타일에 의해 제어됩니다.
* `smooth`: 스크롤이 부드럽게 작동합니다.


### 반환 값

없음 (`undefined`).

예제
--


```html
<!-- put the 100th vertical pixel at the top of the window -->

<button onclick="scroll(0, 100);">click to scroll to the 100th pixel</button>
```


`options` 사용:


```js
window.scroll({
  top: 100,
  left: 100,
  behavior: "smooth",
});
```

참고
--

`Window.scrollTo()`는 이 메서드와 사실상 같습니다. 상대적인 스크롤의 경우 `Window.scrollBy()`, `Window.scrollByLines()` (en-US) 그리고 `Window.scrollByPages()` (en-US)를 참고하십시오.

스크롤 요소의 경우, `Element.scrollTop` (en-US) 그리고 `Element.scrollLeft` (en-US)를 참고하십시오.

명세서
---

| Specification |
| --- |
| CSSOM View Module # dom-window-scroll |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Window.scrollByLines()` (en-US)
* `Window.scrollByPages()` (en-US)
* `Element.scrollIntoView()`
Window.scrollTo()
=================

요약
--

문서의 지정된 위치로 스크롤합니다.

구문
--


```js
window.scrollTo(x_좌표, y_좌표);
```

### 매개변수

* `x_좌표`는 문서의 왼쪽 상단부터 시작하는 픽셀 단위의 가로축입니다.
* `y_좌표`는 문서의 왼쪽 상단부터 시작하는 픽셀 단위의 세로축입니다.

- 또는 -

`options`

다음 매개변수가 포함된 딕셔너리

`top`

창 또는 요소를 스크롤할 Y축을 따라 픽셀 수를 지정합니다.

`left`

창 또는 요소를 스크롤할 X축을 따라 픽셀 수를 지정합니다.

`behavior`

스크롤을 즉시 적용할지 아니면 부드러운 애니메이션을 적용할지 결정합니다. 이 옵션은 다음 값 중 하나의 문자열을 취해야 합니다.

* `smooth`: 스크롤이 부드럽게 움직입니다.
* `instant`: 스크롤이 단번에 즉시 적용됩니다.
* `auto`: 스크롤 동작은 계산된 `scroll-behavior` (en-US) 값에 의해 결정됩니다.


### 반환 값

없음 (`undefined`)

예제
--


```js
window.scrollTo(0, 1000);
```

참고
--

이 함수는 window.scroll (en-US)과 효과적으로 같습니다. 스크롤링 관련 정보는 window.scrollBy (en-US), window.scrollByLines (en-US), 그리고 window.scrollByPages (en-US)가 있습니다.

명세서
---

| Specification |
| --- |
| CSSOM View Module # dom-window-scrollto |
Window.event
============

`Window` 객체의 **`event`** 속성은 웹 사이트의 코드가 현재 처리 중인 `Event`를 반환합니다. 이벤트 처리기 바깥에서는 항상 `undefined`입니다.

신규 코드에서는 사용을 피하세요. 대신, 처리기가 매개변수로 받는 `Event`를 사용해야 합니다. `event` 속성은 많이 지원되지도 않고, 지원하는 환경에서도 나중에 문제가 발생할 여지를 키웁니다.

**참고:** `event` 속성이 반환하는 `Event`가 예상하는 값과 다른 경우가 많습니다. 게다가 섀도우 트리 안에서 발생한 이벤트의 경우 정확하지 않습니다.

명세
--

| Specification |
| --- |
| DOM Standard # dom-window-event |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Event.srcElement` (en-US)
Window.length
=============

window의 frame 개수를 반환합니다. (`<frame>` (en-US) 또는 `<iframe>` (en-US) 요소들 중 하나)

신텍스
---


```js
framesCount = window.length;
```


* `framesCount` 는 frame의 개수이다.
예제
--


```js
if (window.length) {
  // document의 subframes
}
```

명세서
---

| Specification |
| --- |
| HTML Standard # dom-length-dev |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
Window.document
===============

**`window.document`** 속성은 창이 포함한 문서의 참조를 반환합니다.

예제
--


```js
console.log(window.document.title);
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-document-dev |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
Window.confirm()
================

**`Window.confirm()`** 메서드는 확인과 취소 두 버튼을 가지며 메시지를 지정할 수 있는 모달 대화 상자를 띄웁니다.

구문
--


```js
result = window.confirm(message);
```

### Parameters

`message`

경고 대화 상자에 표시할 텍스트 문자열.

### 반환 값

확인 (`true`) 또는 취소 (`false`) 중 사용자가 선택한 값. 브라우저가 페이지 내 대화 상자를 무시하고 있으면 항상 `false`입니다.

예제
--


```js
if (window.confirm("Do you really want to leave?")) {
  window.open("exit.html", "Thanks for Visiting!");
}
```


위 코드는 다음 결과를 보입니다.

![firefox confirm](/ko/docs/Web/API/Window/confirm/firefox_confirm_dialog.png)

참고
--

대화 상자는 모달 창(부모 창으로 돌아가기 전에 사용자의 상호 작용을 요구하는 자식 창)으로, 사용자는 대화 상자가 닫힐 때까지 다른 모든 인터페이스에 접근할 수 없습니다. 따라서 대화 상자(또는 모달 창)를 만드는 함수를 남용하면 안 됩니다. 이 뿐만이 아니더라도, 대화 상자로 사용자 확인을 받는 것은 피해야 할 좋은 이유 여럿이 존재합니다.

명세
--

| Specification |
| --- |
| HTML Standard # dom-confirm-dev |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `window.alert()`
* `window.prompt()`
window.requestIdleCallback()
============================

**실험적:** **이 기능은 실험적인 기능입니다.**  
프로덕션 환경에서 사용하기 전에 브라우저 호환성 표를 주의 깊게 확인하세요.

**`window.requestIdleCallback()`** 메서드는 브라우저의 idle 상태에 호출될 함수를 대기열에 넣습니다. 이를 통해 개발자는 애니메이션 및 입력 응답과 같은 대기 시간이 중요한 이벤트에 영향을 미치지 않고 메인 이벤트 루프에서 백그라운드 및 우선 순위가 낮은 작업을 수행 할 수 있습니다. 함수는 일반적으로 first-in-first-out(FIFO) 순서로 호출됩니다. 하지만, `timeout` 옵션이 지정된 callback은 제한 시간이 지나기 전에 이들을 실행하기 위해 순서에 맞지 않게 호출될 수 있습니다.

idle callback 안에서 `requestIdleCallback()` 을 호출하여 다음 패스가 이벤트 루프를 통과하는 즉시 다른 callback을 예약할 수 있습니다.

**참고:** 필수적인 작업이라면 `timeout` 옵션을 사용하는 것을 강력히 권장합니다. 사용하지 않을 경우 callback이 실행되기전에 몇 초 이상 소요될 수 있습니다.

Syntax
------


```js
var handle = window.requestIdleCallback(callback[, options])
```

### Return value

실행 ID. `window.cancelIdleCallback()` (en-US) 메서드에 인자로 전달하여 callback 실행을 취소할 수 있습니다.

### Parameters

`callback`

이벤트 루프가 유휴 상태가 될 때 호출되어야 하는 함수. callback 함수는 `IdleDeadline` 객체를 인자로 전달받습으며 이 객체를 통해 타임아웃 기간이 만료되어 callback이 실행되었는지 여부를 알 수 있습니다.

`options` Optional

선택적으로 사용가능한 option 설정. 현재는 하나의 property만 정의 되어 있습니다 :\* `timeout`: 만약`timeout` 이 지정되어 있고 양수일 경우, *timeout* 밀리세컨드가 지날 때까지 callback이 실행되지 않았다면 성능상에 부정적인 영향을 미치는 위험이 있더라도 다음 idle 상태에 callback이 호출됩니다.

Example
-------

Cooperative Scheduling of Background Tasks API 포스트의 complete example 예제를 참조해 주십시오.

명세서
---

| Specification |
| --- |
| requestIdleCallback() Cooperative Scheduling of Background Tasks # the-requestidlecallback-method |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `window.cancelIdleCallback()` (en-US)
* `IdleDeadline`
* `window.setTimeout()` (en-US)
* `window.setInterval()` (en-US)
Window.name
===========

요약
--

창의 이름을 얻거나/설정합니다.

문법
--


```js
string = window.name;
window.name = string;
```

예제
--


```js
window.name = "lab\_view";
```

설명
--

창의 이름은 주로 하이퍼링크나 폼의 target으로 설정됩니다. 그외엔, 창은 이름을 가지는 것을 거의 필요로 하지 않습니다.

또한 몇몇 프레임워크에서 창의 이름은 cross-domain messaging을 제공하기 위해 사용됩니다. (예를 들면, SessionVars 과 Dojo's dojox.io.windowName) 좀더 보안을 생각한다면 JSONP로 대체 될 수 있습니다. 하지만 최근 의 웹어플리케이션이 호스팅하는 민감한 데이터들은 cross-domain messaging을 이용하기 위해서 `window.name`에 의존해서는 안되며, 대신 postMessage API를 이용하는 방법이 있습니다.

`window.name`은 `toString` 메소드를 이용해 모든 값을 문자열로 변환합니다.