recursal/MDN huggingface dataset:
HTMLMediaElement.currentSrc
===========================

**`HTMLMediaElement.currentSrc`** 속성에는 선택한 미디어 리소스의 절대 URL이
 포함되어 있습니다. 예를 들어 웹 서버가 사용자 디스플레이의 해상도에 따라
 미디어 파일을 선택하는 경우 이런 일이 발생할 수 있습니다. `networkState` 속성이
 `EMPTY`인 경우 값은 빈 문자열입니다.

값
-

 선택한 미디어 소스의 절대 URL을 포함하는 문자열 객체입니다.
 `networkState`가 `EMPTY`라면 빈 문자열, 아니라면 미디어 요소(element) 내에 포함된 `HTMLSourceElement` (en-US)로
 나열한 리소스 중 하나가 됩니다. 만약 `<source>` (en-US) 요소가
 제공되지 않은 경우 값 또는 src가 됩니다.

예제
--


```js
const obj = document.createElement("video");
console.log(obj.currentSrc); // ""
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-media-currentsrc-dev |

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

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

같이 보기
-----

* currentSrc를 정의하는 인터페이스는 `HTMLMediaElement`입니다.
HTMLMediaElement.currentTime
============================

`HTMLMediaElement` 인터페이스의 **`currentTime`** 속성은
 현재 재생 시간을 초 단위로 지정합니다.

`currentTime`의 값을 변경하면 미디어를 새로운 시간으로 찾습니다.

값
-

현재 재생 시간을 초 단위로 나타내는 배정밀도 부동 소수점 값입니다.

 미디어가 아직 재생되지 않은 경우 `currentTime` 값은 `play()` (en-US)
 메서드가 호출된 후 재생이 시작되는 미디어 내의 시간 위치를 나타냅니다.

`currentTime`을 새 값으로 설정하면 미디어를 사용할 수 있는 경우
 지정된 시간으로 미디어를 찾습니다.

 라이브로 스트리밍되는 미디어와 같이 지속 시간(duration)이 없는 미디어의 경우
 브라우저가 미디어 버퍼에서 만료된 미디어의 일부를 가져오지 못할 수 있습니다.
 또한 타임라인이 0초에서 시작하지 않는 미디어는 해당 타임라인의 가장 빠른 시간
 이전으로 검색할 수 없습니다.

 미디어의 길이(초)는 `duration` 속성을
 사용하여 결정할 수 있습니다.

예제
--


```js
const video = document.createElement("video");
console.log(video.currentTime);
```

사용 일람
-----

### 시간 정밀도 감소

 타이밍 공격 및 핑거프린팅으로부터 보호하기 위해 브라우저는 `currentTime`에서
 반환된 값을 반올림하거나 조정할 수 있습니다.

명세
--

| Specification |
| --- |
| HTML Standard # dom-media-currenttime-dev |

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

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

같이 보기
-----

* currentTime을 정의하는 인터페이스는 `HTMLMediaElement`입니다
* 시간을 설정하는 또 다른 방법은 `HTMLMediaElement.fastSeek()` (en-US)를 참고하세요
* 미디어 재생 시간(초)는 `HTMLMediaElement.duration`를 참고하세요
HTMLMediaElement.seekable
=========================

`HTMLMediaElement` 객체의 **`seekable`** 읽기 전용 속성은 사용자 에이전트가 `seekable` 속성에 접근할 때 찾을 수 있는 미디어 리소스의 범위를 나타내는 새로운 정적 정규화된 `TimeRanges` 객체 (en-US)를 반환합니다.

값
-

`seekable` 속성에 접근할 때 사용자 에이전트가 찾을 수 있는 미디어 리소스의 범위를 나타내는 새로운 정적 정규화된 TimeRanges 객체 (en-US)입니다.

예제
--


```js
const video = document.querySelector("video");
const timeRangesObject = video.seekable;
const timeRanges = [];
// 객체를 살펴보고 배열을 출력합니다
for (let count = 0; count < timeRangesObject.length; count++) {
  timeRanges.push([timeRangesObject.start(count), timeRangesObject.end(count)]);
}
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-media-seekable-dev |
| Media Source Extensions™ # htmlmediaelement-extensions |

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

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

같이 보기
-----

* seekable을 정의하는 인터페이스는 `HTMLMediaElement`입니다.
* 미디어 소스 확장 API (en-US)
* 미디어 버퍼링, 검색 및 시간 범위 (en-US)
HTMLMediaElement: playbackRate property
=======================================

**`HTMLMediaElement.playbackRate`** 속성은 미디어가 재생되는 속도를 설정합니다. 이 속성은 빨리 감기, 슬로우 모션 등에 대한 사용자 컨트롤을 구현하는 데 사용됩니다. 일반적인 재생 속도에 이 값을 곱하여 현재 속도를 얻습니다. `1.0`은 정상 속도를 의미합니다.

`playbackRate`가 음수이면 미디어가 거꾸로 재생됩니다.

빨리 감기나 슬로우 모션이 유용한 범위를 벗어나면 오디오가 음 소거됩니다. (Gecko는 범위 `0.25`에서 `4.0`을 벗어나면 소리가 음 소거됩니다).

오디오의 음높이는 기본적으로 보정됩니다. 보정을 비활성화하려면 `HTMLMediaElement.preservesPitch` (en-US) 속성을 사용하세요.

값
-

`double` `1.0`이 "기본 속도"입니다. `1.0`보다 낮은경우 미디어 속도는 기본 속도보다 느리게 재생되고, 높은 경우 더 빠르게 재생됩니다. (**기본값:** `1.0`)

예시
--


```js
const obj = document.createElement("video");
console.log(obj.playbackRate); // 예상 출력값 : 1
```

명세서
---

| Specification |
| --- |
| HTML Standard # dom-media-playbackrate-dev |

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

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

같이 보기
-----

* `HTMLMediaElement`: `HTMLMediaElement.playbackRate` 속성을 정의하기 위해 사용하는 인터페이스
HTMLMediaElement.duration
=========================

 "읽기 전용" `HTMLMediaElement` 속성
 \*\*`duration`\*\*은 요소의 미디어 길이를 초 단위로 나타냅니다.

값
-

 미디어의 지속 시간을 초 단위로 나타내는 배정밀도 부동 소수점 값입니다.
 사용 가능한 미디어 데이터가 없으면 `NaN` 값이 반환됩니다. 만약 요소의
 미디어에 라이브 미디어 스트림과 같이 전체 길이(초)가 없는 경우
 `duration`은 `+Infinity`입니다.

예제
--


```js
const obj = document.createElement("video");
console.log(obj.duration); // NaN
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-media-duration-dev |

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

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

같이 보기
-----

* 웹 미디어 기술
* 미디어의 현재 재생 위치는 `HTMLMediaElement.currentTime`를 참고하세요.
* `<audio>` (en-US)와 `<video>` 요소들을 참고하세요.
HTMLMediaElement: canplaythrough
================================

`canplaythrough` 이벤트는 user agent 가 media 를 재생할 수 있을 때 발생되며, 컨텐츠의 추가 버퍼링을 위한 정지 없이 media 를 끝까지 재생하기에 로드된 데이터가 충분할 것으로 추산한다.

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

Specification

HTML5 media

Interface

Event

Bubbles

No

Cancelable

No

Target

Element

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. |

Related Events
--------------

* `playing (en-US)`
* `waiting (en-US)`
* `seeking (en-US)`
* `seeked (en-US)`
* `ended (en-US)`
* `loadedmetadata (en-US)`
* `loadeddata (en-US)`
* `canplay`
* `canplaythrough`
* `durationchange (en-US)`
* `timeupdate (en-US)`
* `play (en-US)`
* `pause (en-US)`
* `ratechange (en-US)`
* `volumechange (en-US)`
* `suspend (en-US)`
* `emptied (en-US)`
* `stalled (en-US)`
HTMLMediaElement.src
====================

**`HTMLMediaElement.src`** 속성은 요소(element)에서 사용할 미디어 리소스의
 URL을 나타내는 HTML 미디어 요소의 `src` 속성 값을 반영합니다.


**참고:** 현재 해당 요소에서 사용 중인 미디어 리소스의 URL을 확인하는
 가장 좋은 방법은 `currentSrc`
 속성의 값을 살펴보는 것입니다. 이 속성은 `HTMLSourceElement` (en-US)
 (`<source>` (en-US) 요소를 의미합니다)에 제공된 목록에서
 최상의 또는 선호하는 미디어 리소스의 선택도 고려합니다.


값
-

 요소에서 사용할 미디어 리소스의 URL을 포함하는 문자열 객체입니다.
 이 속성은 HTML 요소의 `src` 속성 값을 반영합니다.

예제
--


```js
const obj = document.createElement("video");
console.log(obj.src); // ""
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-media-src |

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

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

같이 보기
-----

* src를 정의하는 인터페이스는 `HTMLMediaElement`입니다.
abort
=====

**`abort`** 이벤트는 리소스의 로딩이 중단되었을 때, 발생합니다.

개요
--

스펙

DOM L3

인터페이스

유저 인터페이스에서 발생하면 UIEvent, 그렇지 않으면 Event.

버블

안됨

취소 가능

안됨

타겟

Element

디폴트 액션

없음

속성
--

| 속성 | 타입 | 설명 |
| --- | --- | --- |
| `target` 읽기 전용 | `EventTarget` | 이벤트 타겟 (DOM tree의 최상위 타겟). |
| `type` 읽기 전용 | `DOMString` | 이벤트의 타입 |
| `bubbles` 읽기 전용 | `Boolean` | 이벤트가 버블링 되는지 안되는지 |
| `cancelable` 읽기 전용 | `Boolean` | 이벤트가 취소 가능한지 아닌지 |
| `view` 읽기 전용 | `WindowProxy` | `document.defaultView` (document의 `window` ) |
| `detail` 읽기 전용 | `long` (`float`) | 0. |
HTMLMediaElement.readyState
===========================

**`HTMLMediaElement.readyState`** 속성은 미디어의 준비 상태를 나타냅니다.

값
-

아래의 `unsigned short` 값 중 하나입니다.

| 상수 | 값 | 설명 |
| --- | --- | --- |
| `HAVE_NOTHING` | 0 | 미디어 리소스에 대한 정보가 없습니다. |
| `HAVE_METADATA` | 1 | 
 메타데이터 속성이 초기화될 만큼 충분한 미디어 리소스가
 검색되었습니다. seeking에서 더 이상 예외를 발생시키지 않습니다.
  |
| `HAVE_CURRENT_DATA` | 2 | 
 현재 재생 위치에 대한 데이터를 사용할 수 있지만
 실제로 한 프레임 이상을 재생하기에는 충분하지 않습니다.
  |
| `HAVE_FUTURE_DATA` | 3 | 
 현재 재생 위치 및 미래의 최소한의 시간에 대한
 데이터를 사용할 수 있습니다(이 뜻은 비디오의
 최소 두 프레임이 있다는 뜻입니다).
  |
| `HAVE_ENOUGH_DATA` | 4 | 
 충분한 데이터를 사용할 수 있고 다운로드 속도가 충분히
 높아 미디어를 중단 없이 끝까지 재생할 수 있습니다.
  |

예제
--

 이 예제는 `example` 요소에 대해 로드할 오디오 데이터를 수신합니다.
 그런 다음 최소한 현재 재생 위치가 로드되었는지 확인합니다.
 있는 경우 오디오가 재생됩니다.


```html
<audio id="example" preload="auto">
  <source src="sound.ogg" type="audio/ogg" />
</audio>
```



```js
const obj = document.getElementById("example");

obj.addEventListener("loadeddata", () => {
  if (obj.readyState >= 2) {
    obj.play();
  }
});
```

명세
--

| Specification |
| --- |
| HTML Standard # dom-media-readystate-dev |

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

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

같이 보기
-----

* readyState를 정의하는 인터페이스는 `HTMLMediaElement`입니다.
Clients.claim()
===============

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

`Clients` (en-US) 의 **`claim()`** 메소드는 active 서비스워커가 그것의 `scope` (en-US) 를 가지는 모든 클라이언트들의 `controller` (en-US) 로서 자신을 등록하는 것을 허용한다. 이것은 이 서비스워커가 제어하게 될 클라이언트들에 "`controllerchange`" 이벤트를 발생시킨다.

서비스워커가 최초에 등록되면, 페이지들은 다음 로드시까지 그것을 사용하지 않을 것이다. `claim()` 메소드는 그 페이지들을 즉시 제어될 수 있도록 한다. 이로 인해, 당신의 서비스워커는 네트워크 또는 다른 서비스워커를 통해 정기적으로 로드되는 페이지들을 제어하게 된다.

Syntax
------


```js
await clients.claim();
```

### Parameters

None.

### Returns

A `Promise` for `void`.

Example
-------

다음 예시는 서비스워커의 "`activate`" 이벤트 리스너에서 `claim()` 를 사용하므로, fetch 들이 이 서비스워커를 통과하기 전에 동일한 스코프에서 로드된 클라이언트들은 다시 로드될 필요가 없다. .


```js
self.addEventListener("activate", (event) => {
  event.waitUntil(clients.claim());
});
```

명세서
---

| Specification |
| --- |
| Service Workers # clients-claim |

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

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

See also
--------

* Using Service Workers (en-US)
* The service worker lifecycle
* Is ServiceWorker ready?
* `Promises`
* `self.skipWaiting()` - skip the service worker's waiting phase
URLSearchParams()
=================

**`URLSearchParams()`** 생성자는 새로운 `URLSearchParams` 객체를 생성하고 반환합니다.

**참고:** 이 기능은 Web Worker에서 사용할 수 있습니다

구문
--


```js
new URLSearchParams();
new URLSearchParams(init);
```

### 매개변수

`init` Optional

다음 중 하나입니다.

* 문자열. `application/x-www-form-urlencoded` 형식으로 파싱합니다. 선행 `'?'` 문자는 무시합니다.
* 이름-값 문자열 쌍을 생성하는 순회기를 가지는 객체. `FormData` 등의 객체가 이 범주에 속합니다. 참고로 `File` 값은 파일 이름이 아니라 `[object File]`로 직렬화됩니다. (`application/x-www-form-urlencoded` 양식에서의 동작과 동일)
* 문자열 키와 문자열 값으로 구성된 레코드.

### 반환값

`URLSearchParams` 객체 인스턴스입니다.

예제
--

다음 예제는 URL 문자열에서 `URLSearchParams` 객체를 생성하는 모습입니다.


```js
// url 생성자에 전달된 주소를 url.search를 통해 params라는 변수로 검색합니다.
var url = new URL("https://example.com?foo=1&bar=2");
var params = new URLSearchParams(url.search);

// 문자열 리터럴을 전달합니다.
var params2 = new URLSearchParams("foo=1&bar=2");
var params2a = new URLSearchParams("?foo=1&bar=2");

// 일련의 쌍으로 전달합니다.
var params3 = new URLSearchParams([
  ["foo", "1"],
  ["bar", "2"],
]);

// 레코드로 전달합니다.
var params4 = new URLSearchParams({ foo: "1", bar: "2" });
```


다음 예제는 검색 매개변수를 포함한 URL과, 검색 매개변수 객체를 사용해 새로운 URL을 만드는 모습을 보입니다.


```js
const url = new URL("https://example.com/?a=hello&b=world");

console.log(url.href);
// https://example.com/?a=hello&b=world

console.log(url.origin);
// https://example.com

const add_params = {
  c: "a",
  d: new String(2),
  e: false.toString(),
};

const new_params = new URLSearchParams([
  ...Array.from(url.searchParams.entries()), // [["a","hello"],["b","world"]]
  ...Object.entries(add_params), // [["c","a"],["d","2"],["e","false"]]
]).toString();
console.log(new_params);
// a=hello&b=world&c=a&d=2&e=false

const new_url = new URL(`${url.origin}${url.pathname}?${new\_params}`);

console.log(new_url.href);
// https://example.com/?a=hello&b=world&c=a&d=2&e=false

// (URL, Record<string, string>)을 받는 함수
const addSearchParams = (url, params = {}) =>
  new URL(
    `${url.origin}${url.pathname}?${new URLSearchParams([
 ...Array.from(url.searchParams.entries()),
 ...Object.entries(params),
 ]).toString()}`,
  );
```

명세
--

| Specification |
| --- |
| URL Standard # dom-urlsearchparams-urlsearchparams |

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

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

`URLSearchParams` 인터페이스의 **`delete()`** 메서드는 지정한 키와 연관된 모든 값을 검색 매개변수 리스트에서 제거합니다.

**참고:** 이 기능은 Web Worker에서 사용할 수 있습니다

구문
--


```js
delete name;
```

### 매개변수

`name`

제거할 매개변수의 이름입니다.

### 반환 값

없음 (`undefined`).

예제
--


```js
let url = new URL("https://example.com?foo=1&bar=2&foo=3");
let params = new URLSearchParams(url.search);

// foo 매개변수 제거
params.delete("foo"); // 이제 쿼리 문자열이 'bar=2'
```

명세
--

| Specification |
| --- |
| URL Standard # dom-urlsearchparams-delete |

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

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

`URLSearchParams` 인터페이스의 **`set()`** 메서드는 주어진 검색 매개변수의 값을 지정한 값으로 설정합니다. 만약 해당 검색 매개변수에 연관된 값이 여러 개라면, 설정한 값을 제외한 나머지는 모두 제거됩니다. 반대로 검색 매개변수가 존재하지 않으면 새로 생성합니다.

**참고:** 이 기능은 Web Worker에서 사용할 수 있습니다

구문
--


```js
set(name, value);
```

### 매개변수

`name`

설정할 매개변수의 이름입니다.

`value`

설정할 매개변수의 값입니다.

### 반환 값

없음 (`undefined`).

예제
--


```js
let url = new URL("https://example.com?foo=1&bar=2");
let params = new URLSearchParams(url.search);

// 세 번째 매개변수 추가
params.set("baz", 3);
params.toString(); // "foo=1&bar=2&baz=3"
```

명세
--

| Specification |
| --- |
| URL Standard # dom-urlsearchparams-set |

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

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

`URLSearchParams` 인터페이스의 **`get()`** 메서드는 지정한 키와 연관된 첫 번째 값을 반환합니다.

**참고:** 이 기능은 Web Worker에서 사용할 수 있습니다

구문
--


```js
get(name);
```

### 매개변수

`name`

반환할 매개변수의 이름입니다.

### Return value

검색 매개변수를 찾으면 문자열, 아니면 \*\*`null`\*\*입니다.

예제
--

페이지 URL이 `https://example.com/?name=Jonathan&age=18`이라고 가정할 때, 다음 코드로 'name'과 'age' 매개변수를 가져올 수 있습니다.


```js
let params = new URLSearchParams(document.location.search);
let name = params.get("name"); // 문자열 "Jonathan"
let age = parseInt(params.get("age"), 10); // 숫자 18
```


쿼리 문자열에 존재하지 않는 매개변수를 가져오려고 시도하면 \*\*`null`\*\*을 반환합니다.


```js
let address = params.get("address"); // null
```

명세
--

| Specification |
| --- |
| URL Standard # dom-urlsearchparams-get |

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

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

`URLSearchParams` 인터페이스의 **`toString()`** 메서드는 URL에 사용할 수 있는 쿼리 문자열을 반환합니다.

**참고:** 이 메서드는 선행 `'?'`를 붙이지 않은 쿼리 문자열을 반환합니다. 이 동작은 `'?'`를 포함한 값을 반환하는 `window.location.search` (en-US)와 다릅니다.

**참고:** 이 기능은 Web Worker에서 사용할 수 있습니다

구문
--


```js
toString();
```

### 매개변수

없음.

### 반환 값

물음표 없는 문자열입니다. 아무런 검색 매개변수도 설정하지 않은 경우에는 빈 문자열을 반환합니다.

예제
--


```js
const url = new URL("https://example.com?foo=1&bar=2");
const params = new URLSearchParams(url.search);

// 두 번째 foo 매개변수 추가
params.append("foo", 4);
console.log(params.toString()); // 'foo=1&bar=2&foo=4' 출력
```

명세
--

| Specification |
| --- |
| URL Standard # urlsearchparams-stringification-behavior |

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

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

같이 보기
-----

* `URL` 인터페이스.
* Google Developers: Easy URL manipulation with URLSearchParams
URLSearchParams.append()
========================

`URLSearchParams` 인터페이스의 **`append()`** 메서드는 지정한 키/값 쌍을 새로운 검색 매개변수로서 추가합니다.

아래 예제에서도 볼 수 있듯, 같은 키를 여러 번 추가하면 매개변수 문자열에 각각의 키와 함께 여러 번 나타나게 됩니다.

**참고:** 이 기능은 Web Worker에서 사용할 수 있습니다

구문
--


```js
append(name, value);
```

### 매개변수

`name`

추가할 매개변수의 이름입니다.

`value`

추가할 매개변수의 값입니다.

### 반환 값

없음 (`undefined`).

예제
--


```js
let url = new URL("https://example.com?foo=1&bar=2");
let params = new URLSearchParams(url.search);

// 두 번째 foo 매개변수 추가
params.append("foo", 4);
// 이제 쿼리 문자열이 'foo=1&bar=2&foo=4'
```

명세
--

| Specification |
| --- |
| URL Standard # dom-urlsearchparams-append |

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

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

같이 보기
-----

* URL 관련 다른 인터페이스: `URL`, `HTMLHyperlinkElementUtils`.
* Google Developers: Easy URL manipulation with URLSearchParams
Navigator: geolocation 속성
=========================

**Secure context:** This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

**`Navigator.geolocation`** 읽기 전용 속성은 웹에서 장치의 위치를 알아낼 때 사용할 수 있는 `Geolocation` 객체를 반환합니다. 웹 사이트나 웹 앱은 위치정보를 사용해 결과 화면을 맞춤 설정할 수 있습니다.

**참고:** 보안 상의 문제로, 웹 페이지가 위치 정보에 접근을 시도하면 사용자에게 알림을 보내고 권한을 허용할지 묻습니다. 각 브라우저는 자신만의 권한 정책과 요청 방식을 가지고 있으므로 주의해야 합니다.

명세
--

| Specification |
| --- |
| Geolocation API # dom-navigator-geolocation |

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

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

같이 보기
-----

* Geolocation API 사용하기
window.navigator.battery
========================

`battery` 객체는 시스템의 배터리 충전 상태에 대한 정보를 제공합니다. 배터리의 충전 상태가 변화할때 발생하는 이벤트에 대한 처리도 가능 합니다. 이 객체는 Battery Status API 의 구현입니다. 보다 자세한 내용, API, 샘플 코드 등은 문서를 참고 해 주세요.

문법
--


```js
var battery = window.navigator.battery;
```

값
-

`navigator.battery` 는 `BatteryManager` 객체 입니다.

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

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

같이 보기
-----

* `BatteryManager`
* Battery Status API 문서
* 블로그 - Using the Battery API
* David Walsh 가 쓴 the JavaScript Battery Api
* battery.js - 경량의 크로스 브라우저 랩퍼(wrapper)
window.navigator.connection
===========================

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

요약
--

네트워크 정보 API는 사용자 기기의 현재 대역폭이나 연결이 과금되는 지와 같은 정보를 알려줍니다. 이를 이용해서 사용자의 연결에 기반해서 높은 품질의 콘텐츠를 제공할지 낮은 품질의 콘텐츠를 제공할지 선택할 수 있습니다.

속성
--

`connection.bandwidth` 읽기 전용

현재 연결에 대한 다운로드 대역폭을 MB/s 단위의 double 형태로 알려줍니다. 사용자가 오프라인일 경우는 `0`이고 알 수 없을 경우에는 `infinity`로 나옵니다.

`connection.metered` 읽기 전용

연결이 과금이 되는 경우(예를 들어 pay-per-use) `Boolean` 형의 `true`가 반환됩니다.

### 이벤트 핸들러

`connection.onchange`

`change (en-US)` 이벤트에 대한 이벤트 핸들러 속성입니다. 연결 정보가 변경될 때 이벤트가 발생합니다.


**참고:** **주의:** `connection` 객체는 이벤트를 다루기 위한 `addEventListener` 메서드를 사용할 수 있는 `EventTarget`을 상속받습니다.

명세
--

| Specification |
| --- |
| Network Information API # connection-attribute |

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

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

관련 내용
-----

* Network Information API
* Online and offline events
Navigator.share
===============

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

**`Navigator.share()`** 메소드는 Web Share API 의 부분으로서 디바이스의 네이티브 공유하기 메커니즘을 작동시킨다. Web Share API 가 지원되지 않는다면, 이 메소드는 `undefined` 일 것이다.

Syntax
------


```js
var sharePromise = window.navigator.share(data);
```

### Parameters

* *data*
    + : 공유할 데이터가 담긴 객체. 아래의 필드들 중 적어도 하나는 명시되어야 한다. 사용 가능한 옵션들은:
* `url`: 공유될 URL을 나타내는 `USVString`.
* `text`: 공유될 본문을 나타내는 `USVString`.
* `title`: 공유될 제목을 나타내는 `USVString`.
### Return value

사용자가 공유하기 액션을 완료하면 resolve 될 `Promise` (en-US). *data* 파라메터가 정확하게 명시되지 않는다면 즉시 reject 될 것이다.

예를 들어, 안드로이드용 크롬에서 반환되는 `Promise` 는 사용자가 공유할 애플리케이션을 선택한 후에 resolve 될 것이다.

Examples
--------


```js
navigator.share({
  title: document.title,
  text: "Hello World",
  url: "https://developer.mozilla.org",
}); // share the URL of MDN
```

명세서
---

| Specification |
| --- |
| Web Share API # share-method |

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

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

**Secure context:** This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

**`Navigator.registerProtocolHandler()`** 메서드는 웹 사이트가 특정 URL 스킴("프로토콜")을 열거나 처리할 수 있도록 등록합니다. 이를테면, 이메일 사이트가 `mailto:` URL에, VoIP 사이트가 `tel:` URL에 자신을 등록할 때 사용할 수 있습니다.

구문
--


```js
navigator.registerProtocolHandler(protocol, url, title);
```

### 매개변수

`protocol`

웹 사이트가 처리하고자 하는 프로토콜 문자열. 예컨대 SMS 문자 메시지를 처리하고자 한다면 `"sms"`를 전달하세요.

`url`

처리기의 URL. **플레이스홀더로 사용할 `%s`를 반드시 포함**해야 합니다. 실제 사용 시, `%s`에는 처리 대상 URL을 이스케이프 처리해 대입합니다.> **참고:** 처리기의 URL은 반드시 `http` 또는 `https` 스킴을 필요로 합니다. 일부 브라우저는 보안상 `https`를 요구하므로 `https`를 사용하는 편이 좋습니다.

`title`

사람이 읽을 수 있는 형태의 처리기 이름. 브라우저 설정 등 처리기 목록에서 **사용자에게 보이는 이름**입니다.

### 예외

`SecurityError`

사용자 에이전트가 등록을 막았습니다. 다음 상황에서 발생할 수 있습니다.\* 등록하려는 스킴(프로토콜)이 유효하지 않습니다. 브라우저가 직접 처리하는 스킴을 등록하려 하면 발생합니다. (`https:`, `about:`, ...)

* 처리기 URL의 출처가 API를 호출한 페이지 출처와 일치하지 않습니다.
* 브라우저가 보안 맥락에서의 `registerProtocolHandler()` 호출을 요구합니다.
* 브라우저가 처리기 URL의 HTTPS 사용을 요구합니다.

`SyntaxError`

처리기 URL에 `%s` 플레이스홀더가 없습니다.

가능한 스킴
------

보안상의 이유로, `registerProtocolHandler()`가 등록할 수 있는 스킴은 제한적입니다.

**사용자 지정 스킴**은 다음 조건을 만족해야 합니다.

* 스킴이 `web+`로 시작합니다.
* `web+` 접두사 뒤에 다른 글자가 최소 하나 존재해야 합니다.
* 소문자 ASCII 문자로만 구성해야 합니다.

아래 예제에서 사용한 `web+burger`는 제약조건을 만족하는 사용자 지정 스킴입니다.

그 외에는 다음 스킴을 등록할 수 있습니다.

* `bitcoin`
* `geo`
* `im`
* `irc`
* `ircs`
* `magnet`
* `mailto`
* `mms`
* `news`
* `nntp`
* `openpgp4fpr`
* `sip`
* `sms`
* `smsto`
* `ssh`
* `tel`
* `urn`
* `webcal`
* `wtai`
* `xmpp`
예제
--

사이트 주소가 `burgers.example.com`인 경우, 아래 코드로 `web+burger:` 스킴에 대한 처리기를 등록할 수 있습니다.


```js
navigator.registerProtocolHandler(
  "web+burger",
  "https://burgers.example.com/?burger=%s",
  "Burger handler",
);
```


이제, `web+burger:` 링크는 사용자를 `burgers.example.com`로 보내고, 자신의 URL을 `%s` 위치에 삽입합니다.

이때, 예제 코드는 처리기 URL과 같은 출처를 가져야 하므로 `https://burgers.example.com`의 페이지 안에서 호출해야 하며, 처리기 URL은 `http`/`https`를 사용해야 합니다.

명세
--

| Specification |
| --- |
| HTML Standard # custom-handlers |

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

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

**`Navigator.mediaDevices`** 읽기 전용 속성은 카메라, 마이크, 화면 공유와 같이 현재 연결된 미디어 입력 장치에 접근할 수 있는 `MediaDevices` 객체를 반환합니다.

구문
--


```js
var mediaDevices = navigator.mediaDevices;
```

### 반환 값

`MediaDevices` 싱글톤 객체.

명세
--

| Specification |
| --- |
| Media Capture and Streams # mediadevices |

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

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

참조
--

* Media Capture and Streams API: 전체 미디어 스트림 API 문서의 시작 지점.
* WebRTC API: 밀접한 관련이 있는 WebRTC API 문서.
Navigator.language
==================

**`Navigator.language`** 읽기 전용 속성은 사용자의 선호 언어(일반적으로 브라우저 UI의 언어)를 나타내는 문자열을 반환합니다.

구문
--


```js
const lang = navigator.language;
```

### 값

RFC 5646: Tags for Identifying Languages(BCP 47)가 정의한 언어 태그의 `DOMString`입니다. 유효한 값은 "en", "en-US", "ko", "ko-KR" 등입니다.

iOS Safari 버전 10.2 이전에서는 "en-us", "ko-kr"처럼 국가 코드를 소문자로 반환합니다.

예제
--


```js
if (/^en\b/.test(navigator.language)) {
  doLangSelect(window.navigator.language);
}
```

명세
--

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

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

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

같이 보기
-----

* `navigator.languages` (en-US)
* `navigator`