initial commit

4 files changed, 381 insertions, 0 deletions

diff --git a/files/ko/web/api/windoweventhandlers/index.html b/files/ko/web/api/windoweventhandlers/index.html
new file mode 100644
index 0000000000..751168141a
--- /dev/null
+++ b/files/ko/web/api/windoweventhandlers/index.html
@@ -0,0 +1,101 @@
+---
+title: WindowEventHandlers
+slug: Web/API/WindowEventHandlers
+tags:
+  - API
+  - HTML-DOM
+  - Interface
+  - Mixin
+  - Reference
+  - WindowEventHandlers
+translation_of: Web/API/WindowEventHandlers
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<p>The <strong><code>WindowEventHandlers</code></strong> mixin describes the event handlers common to several interfaces like {{domxref("Window")}}, or {{domxref("HTMLBodyElement")}} and {{domxref("HTMLFrameSetElement")}}. Each of these interfaces can implement additional specific event handlers.</p>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: <code>WindowEventHandlers</code> is a mixin and not an interface; you can't actually create an object of type <code>WindowEventHandlers</code>.</p>
+</div>
+
+<h2 id="Properties">Properties</h2>
+
+<p><em>The events properties, of the form <code>onXYZ</code>, are defined on the {{domxref("WindowEventHandlers")}}, and implemented by {{domxref("Window")}}, and {{domxref("WorkerGlobalScope")}} for Web Workers.</em></p>
+
+<dl>
+ <dt>{{domxref("WindowEventHandlers.onafterprint")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("afterprint")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onbeforeprint")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("beforeprint")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onbeforeunload")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("beforeunload")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onhashchange")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("hashchange")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onlanguagechange")}} {{experimental_inline}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("languagechange")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onmessage")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("message")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onmessageerror")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("MessageError")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onoffline")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("offline")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.ononline")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("online")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onpagehide")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pagehide")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onpageshow")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pageshow")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onpopstate")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("popstate")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onstorage")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("storage")}} event is raised.</dd>
+ <dt>{{domxref("WindowEventHandlers.onunhandledrejection")}} {{experimental_inline}}</dt>
+ <dd>An event handler for unhandled {{jsxref("Promise")}} rejection events.</dd>
+ <dt>{{domxref("WindowEventHandlers.onunload")}}</dt>
+ <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("unload")}} event is raised.</dd>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<p><em>This interface defines no method.</em></p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', '#windoweventhandlers', 'WindowEventHandlers')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', '#windoweventhandlers', 'WindowEventHandlers')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot of {{SpecName("HTML WHATWG")}}. Added <code>onlanguage</code> since the {{SpecName("HTML5 W3C")}} snapshot.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "#windoweventhandlers", "WindowEventHandlers")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowEventHandlers</code> (properties where on the target before it).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("api.WindowEventHandlers")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("Window")}} and {{domxref("WorkerGlobalScope")}}</li>
+</ul>
diff --git a/files/ko/web/api/windoweventhandlers/onhashchange/index.html b/files/ko/web/api/windoweventhandlers/onhashchange/index.html
new file mode 100644
index 0000000000..1a9f932360
--- /dev/null
+++ b/files/ko/web/api/windoweventhandlers/onhashchange/index.html
@@ -0,0 +1,159 @@
+---
+title: WindowEventHandlers.onhashchange
+slug: Web/API/WindowEventHandlers/onhashchange
+tags:
+  - HTML-DOM
+  - Property
+  - Reference
+  - WindowEventHandlers
+translation_of: Web/API/WindowEventHandlers/onhashchange
+---
+<div>
+<div>{{APIRef("HTML DOM")}}</div>
+
+<div>{{domxref("WindowEventHandlers")}} 믹스인의 <strong>WindowEventHandlers.onhashchange</strong> 속성은 </div>
+</div>
+
+<p><strong>hashchange </strong>이벤트를 처리하기 위한 {{domxref("EventHandler")}} 입니다.</p>
+
+<p>hashchange 이벤트는 윈도우의 해시가 변경되면 시작됩니다. ( {{domxref("Window.location")}} 및 {{domxref("HTMLHyperlinkElementUtils.hash")}} 참조)</p>
+
+<h2 id="문법">문법</h2>
+
+<p><strong>event handler:</strong></p>
+
+<pre class="syntaxbox">window.onhashchange = funcRef;
+</pre>
+
+<p><strong>HTML event handler:</strong></p>
+
+<pre class="syntaxbox">&lt;body onhashchange="funcRef();"&gt;
+</pre>
+
+<p><strong>event listener:</strong></p>
+
+<p>{{domxref("EventTarget.addEventListener()", "addEventListener()")}}를 사용하여 이벤트 리스너 추가하기</p>
+
+<pre class="syntaxbox">window.addEventListener("hashchange", funcRef, false);
+</pre>
+
+<h3 id="매개변수">매개변수</h3>
+
+<dl>
+ <dt><code>funcRef</code></dt>
+ <dd>함수에 대한 참조.</dd>
+</dl>
+
+<h2 id="예제">예제</h2>
+
+<h3 id="event_handler_사용하기">event handler 사용하기</h3>
+
+<p>This example uses an event handler (<code>window.onhashchange</code>) to check the new hash value whenever it changes. If it equals <code>#cool-feature</code>, the script logs a message to the console.</p>
+
+<pre><code>function locationHashChanged() {
+  if (location.hash === '#cool-feature') {
+    console.log("You're visiting a cool feature!");
+  }
+}
+
+window.onhashchange = locationHashChanged;</code>
+</pre>
+
+<h3 id="Using_an_event_listener">Using an event listener</h3>
+
+<p>이 예제는 이벤트 리스너를 사용하여 해시가 변경 될 때마다 콘솔에 알림표시합니다.</p>
+
+<pre><code>function hashHandler() {
+  console.log('The hash has changed!');
+}
+
+window.addEventListener('hashchange', hashHandler, false);</code></pre>
+
+<h3 id="Overriding_the_hash">Overriding the hash</h3>
+
+<p>이 함수는 새로운 해시를 동적으로 설정하여 임의로 두 값 중 하나로 설정합니다.</p>
+
+<pre><code>function changeHash() {
+  location.hash = (Math.random() &gt; 0.5) ? 'location1' : 'location2';
+}</code>
+</pre>
+
+<h2 id="hashchange_이벤트">hashchange 이벤트</h2>
+
+<p><code>hashchange</code> 이벤트에는 다음과 같은 필드가 있습니다:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Field</td>
+   <td class="header">Type</td>
+   <td class="header">Description</td>
+  </tr>
+  <tr>
+   <td><code>newURL</code> {{gecko_minversion_inline("6.0")}}</td>
+   <td><code>DOMString</code></td>
+   <td>탐색할 새로운 URL입니다.</td>
+  </tr>
+  <tr>
+   <td><code>oldURL</code> {{gecko_minversion_inline("6.0")}}</td>
+   <td><code>DOMString</code></td>
+   <td>탐색했던 이전의 URL입니다.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="제2의_해결책을_위한_event.newURL_와_event.oldURL">제2의 해결책을 위한 event.newURL 와 event.oldURL</h3>
+
+<pre class="brush: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;
+	});
+}());
+</pre>
+
+<h2 id="명세">명세</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', '#windoweventhandlers', 'GlobalEventHandlers')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', '#windoweventhandlers', 'GlobalEventHandlers')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "#windoweventhandlers", "GlobalEventHandlers")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">브라우저 호환성</h2>
+
+<p>{{Compat("api.WindowEventHandlers.onhashchange")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><code><a href="https://developer.mozilla.org/en-US/docs/Web/API/Window/hashchange_event">hashchange</a></code> event</li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history" title="DOM/Manipulating the browser history">Manipulating the browser history</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/DOM/window.history" title="DOM/window.history"><code>history.pushState()</code> and <code>history.replaceState()</code></a> methods</li>
+ <li>{{domxref("WindowEventHandlers.onpopstate")}}</li>
+ <li>{{domxref("HTMLHyperlinkElementUtils.hash")}}</li>
+</ul>
diff --git a/files/ko/web/api/windoweventhandlers/onpopstate/index.html b/files/ko/web/api/windoweventhandlers/onpopstate/index.html
new file mode 100644
index 0000000000..4da830dbe2
--- /dev/null
+++ b/files/ko/web/api/windoweventhandlers/onpopstate/index.html
@@ -0,0 +1,57 @@
+---
+title: WindowEventHandlers.onpopstate
+slug: Web/API/WindowEventHandlers/onpopstate
+translation_of: Web/API/WindowEventHandlers/onpopstate
+---
+<div>{{APIRef}} {{gecko_minversion_header("2")}}</div>
+
+<h2 id="Summary" name="Summary">요약</h2>
+
+<p>window의 popstate 이벤트 핸들러</p>
+
+<p>같은 document에 관한 두개의 히스토리 엔트리에 변화가 일어날 때마다, popstate event가 window 객체에 붙게 된다. 만약 활성화된 엔트리가 history.pushState() 메서드나 history.replaceState() 메서드에 의해 생성되면, popstate 이벤트의 state 속성은 히스토리 엔트리 state 객체의 복사본을 갖게 된다.</p>
+
+<p>history.pushState() 또는 history.replaceState()는 popstate 이벤트를 발생시키지 않는 것에 유의한다.popstate 이벤트는 브라우저의 백 버튼이나 (history.back() 호출) 등을 통해서만 발생된다. 그리고 그 이벤트는 같은 document에서 두 히스토리 엔트리 간의 이동이 있을 때만 발생이 된다.</p>
+
+<p>브라우저는 popstate 이벤트를 페이지 로딩시에 다르게 처리한다. Chrome(v34 이전버전) 와 Safari는 popstate 이벤트를 페이지 로딩시에 발생시킨다. 하지만 Firefox 는 그렇지 않다.</p>
+
+<h2 id="Syntax" name="Syntax">문법</h2>
+
+<pre class="syntaxbox">window.onpopstate = <var>funcRef</var>;
+</pre>
+
+<ul>
+ <li><var>funcRef는 이벤트 핸들러 함수다.</var></li>
+</ul>
+
+<h2 id="The_popstate_event" name="The_popstate_event">popstate 이벤트</h2>
+
+<p>예시를 보자, 다음의 코드를 실행하는 <code><var>http://example.com/example.html</var></code>의 한 페이지는 주석에 쓰여있는 경고들을 발생시킨다.</p>
+
+<pre class="brush:js">window.onpopstate = function(event) {
+  alert("location: " + document.location + ", state: " + JSON.stringify(event.state));
+};
+
+history.pushState({page: 1}, "title 1", "?page=1");
+history.pushState({page: 2}, "title 2", "?page=2");
+history.replaceState({page: 3}, "title 3", "?page=3");
+history.back(); // alerts "location: http://example.com/example.html?page=1, state: {"page":1}"
+history.back(); // alerts "location: http://example.com/example.html, state: null
+history.go(2);  // alerts "location: http://example.com/example.html?page=3, state: {"page":3}
+</pre>
+
+<p>원래의 히스토리 엔트리인 (<code><var>http://example.com/example.html</var></code>) 에 이와 연관된 state 객체가 없더라도, 두번째 history.back() API 호출 후 엔트리를 활성화 시키면 popstate 이벤트는 여전히 발생된다.</p>
+
+<h2 id="Specification" name="Specification">Specification</h2>
+
+<ul>
+ <li><a href="http://www.whatwg.org/specs/web-apps/current-work/#handler-window-onpopstate">HTML5 popstate event</a></li>
+</ul>
+
+<h2 id="See_also" name="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("window.history")}}</li>
+ <li><a href="/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history">Manipulating the browser history</a></li>
+ <li><a href="/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history/Example">Ajax navigation example</a></li>
+</ul>
diff --git a/files/ko/web/api/windoweventhandlers/onstorage/index.html b/files/ko/web/api/windoweventhandlers/onstorage/index.html
new file mode 100644
index 0000000000..8490ff6119
--- /dev/null
+++ b/files/ko/web/api/windoweventhandlers/onstorage/index.html
@@ -0,0 +1,64 @@
+---
+title: WindowEventHandlers.onstorage
+slug: Web/API/WindowEventHandlers/onstorage
+tags:
+  - API
+  - Event Handler
+  - Property
+  - Reference
+  - Web Storage
+  - WindowEventHandlers
+translation_of: Web/API/WindowEventHandlers/onstorage
+---
+<div class="syntaxbox">{{APIRef}}</div>
+
+<p>{{domxref("WindowEventHandlers")}} 믹스인의 <strong><code>onstorage</code></strong> 속성은 <code><a href="/ko/docs/Web/API/Window/storage_event">storage</a></code> 이벤트를 처리하는 {{domxref("EventHandler")}}입니다.</p>
+
+<p><code>storage</code> 이벤트는 다른 문서에서 저장소를 변경했을 때 발생합니다.</p>
+
+<h2 id="구문">구문</h2>
+
+<pre class="syntaxbox notranslate"><em> </em><em>window</em>.onstorage = <em>functionRef</em>;</pre>
+
+<h3 id="값">값</h3>
+
+<p><code>functionRef</code>는 함수 이름 혹은 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/function">함수 표현식</a>으로, 단일 매개변수로써 {{domxref("StorageEvent")}}를 받습니다.</p>
+
+<h2 id="예제">예제</h2>
+
+<p>다음 예제는 다른 문서에서 저장소 키를 바꿀 때마다 메시지를 기록합니다.</p>
+
+<pre class="brush: js notranslate">window.onstorage = function(e) {
+  console.log('The ' + e.key +
+    ' key has been changed from ' + e.oldValue +
+    ' to ' + e.newValue + '.');
+};</pre>
+
+<h2 id="명세">명세</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG','webappapis.html#handler-window-onstorage','onstorage')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+
+
+<p>{{Compat("api.WindowEventHandlers.onstorage")}}</p>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li><a href="/ko/docs/Web/API/Window/storage_event">Window: <code>storage</code> 이벤트</a></li>
+</ul>