unslug ko: move

5 files changed, 123 insertions, 194 deletions

diff --git a/files/ko/web/api/htmlelement/accesskey/index.html b/files/ko/web/api/htmlelement/accesskey/index.html
new file mode 100644
index 0000000000..0fc48bd749
--- /dev/null
+++ b/files/ko/web/api/htmlelement/accesskey/index.html
@@ -0,0 +1,35 @@
+---
+title: Element.accessKey
+slug: Web/API/Element/accessKey
+tags:
+  - API
+  - Access Keys
+  - DOM
+  - Hotkeys
+  - NeedsContent
+  - 레퍼런스
+  - 속성
+  - 엘리먼트
+  - 키보드 단축키
+translation_of: Web/API/HTMLElement/accessKey
+translation_of_original: Web/API/Element/accessKey
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p><code><strong>Element.accessKey</strong></code> 속성은 주어진 사용자가 눌러 주어진 엘리먼트로 이동할 수 있는 키 입력 세트입니다.</p>
+
+<div class="note">
+<p><code>Element.accessKey</code> 속성은 브라우저에 이미 바인딩 된 키와의 여러 충돌로 인해 거의 사용되지 않습니다. 이를 해결하기 위해, 브라우저는 다른 "적절한" 키(예, <kbd>Alt</kbd> + accesskey)와 함께 키가 눌렸을 때동작하도록 구현하였습니다.</p>
+</div>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+
+
+<p>{{Compat("api.Element.accessKey")}}</p>
+
+<h2 id="함께_보기">함께 보기</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/ko/docs/Web/HTML/Global_attributes/accesskey">HTML 전역 속성: accesskey</a></li>
+</ul>
diff --git a/files/ko/web/api/htmlelement/dataset/index.html b/files/ko/web/api/htmlelement/dataset/index.html
deleted file mode 100644
index 2b2a891dca..0000000000
--- a/files/ko/web/api/htmlelement/dataset/index.html
+++ /dev/null
@@ -1,127 +0,0 @@
----
-title: HTMLElement.dataset
-slug: Web/API/HTMLElement/dataset
-tags:
-  - API
-  - HTML DOM
-  - HTMLElement
-  - HTMLOrForeignElement
-  - Property
-  - Read-only
-  - Reference
-translation_of: Web/API/HTMLOrForeignElement/dataset
----
-<div>{{APIRef("HTML DOM")}}</div>
-
-<p><span class="seoSummary"><code><strong>HTMLElement.dataset</strong></code> 읽기 전용 속성은 요소의 <a href="/ko/docs/Web/HTML/Global_attributes/data-*">사용자 지정 데이터 특성</a>(<code>data-*</code>)에 대한 읽기와 쓰기 접근 방법을 HTML과 DOM 양측에 제공합니다.</span> 반환하는 값은 {{domxref("DOMStringMap")}}으로, 각 데이터 특성마다 하나의 항목을 가집니다. <code>dataset</code> 속성 자체는 읽기 전용이라는 점에 주의하세요. 모든 쓰기 작업은 <code>dataset</code> 안의, 데이터 특성을 나타내는 각각의 속성에 수행해야 합니다. 또한 HTML의 <code>data-이름</code>과, 이에 대응하는 DOM <code>dataset['이름']</code>의 <code>이름</code>은 서로 일치하지 않으나, 다음 규칙에 따라 유사함을 기억하세요.</p>
-
-<ul>
- <li>HTML의 사용자 지정 특성 이름은 <code>data-</code>로 시작합니다. 또한 문자, 숫자, 대시(<code>-</code>), 점(<code>.</code>), 콜론(<code>:</code>), 언더스코어(<code>_</code>)만 사용할 수 있고, ASCII 대문자(<code>A</code>-<code>Z</code>)는 사용할 수 없습니다.</li>
- <li>JavaScript의 사용자 지정 특성 이름은 HTML 이름을 카멜 표기법으로 변환한 형태로, 대시, 점 등을 모두 제거합니다.</li>
-</ul>
-
-<p>아래의 내용과 함께, <a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Using data attributes</a> 아티클에서는 HTML 데이터 속성을 어떻게 쓰는지 안내를 찾을 수 있습니다. </p>
-
-<h3 id="Name_conversion">Name conversion</h3>
-
-<p>dash-style 에서 camelCase로 변환: 커스텀 데이터 속성의 이름은 아래의 규칙에 따라 {{ domxref("DOMStringMap") }}의 key로 변환됩니다. </p>
-
-<ul>
- <li>접두사 <code>data-</code> 는 삭제됩니다. (대시 포함);</li>
- <li><code>a</code><span style="line-height: 1.5;"> 부터 </span><code>z</code> 까지 <span style="line-height: 1.5;">ASCII 소문자 앞에 오는</span> 모든 대시(<code>U+002D</code>)는 삭제되고 해당 소문자는 대문자로 변환됩니다.</li>
- <li>다른 기호는(다른 대시들을 포함한) 바뀌지 않습니다.</li>
-</ul>
-
-<p>camelCase 에서 dash-style로 변환: key를 속성 이름으로 매핑하는 반대의 변환은 아래의 규칙을 따릅니다.:</p>
-
-<ul>
- <li>제약 조건: 대시 바로 뒤에는 <code>a</code> 에서 <code>z</code> 까지 ASCII 소문자를 쓸 수 없습니다 (변환 전);</li>
- <li>접두사 <code>data-</code> 가 추가됩니다;</li>
- <li><code>A</code> 에서 <code>Z</code> 까지 모든 ASCII 대문자는 대시와 해당 소문자로 변환됩니다;</li>
- <li>다른 문자는 변하지 않습니다.</li>
-</ul>
-
-<p>이러한 제약 조건은 반드시 두 변환이 서로의 역이 되도록 합니다.</p>
-
-<p>예를 들어, <code>data-abc-def</code> 라는 이름의 속성은 <code>abcDef</code> 라는 키에 대응합니다.</p>
-
-<h3 id="Accessing_values">Accessing values</h3>
-
-<ul>
- <li>속성들은 <code>element.dataset.keyname</code><em>과 같이</em> dataset의 객체 속성처럼 camelCase 이름(키)을 사용해서 설정하거나 읽을 수 있습니다</li>
- <li>속성들은 또한 <code>element.dataset[keyname]</code>과 같이 객체 속성의 괄호 신택스로 설정하거나 읽을 수 있습니다.</li>
-</ul>
-
-<h2 id="Syntax">Syntax</h2>
-
-<ul>
- <li><em>string</em> = <em>element</em>.<strong>dataset</strong>.<em>camelCasedName</em>;</li>
- <li><em>element.</em><strong>dataset</strong>.<em>camelCasedName</em> = <em>string</em>;</li>
- <br>
- <li><em>string</em> = <em>element</em>.<strong>dataset</strong>[<em>camelCasedName</em>];</li>
- <li><em>element</em>.<strong>dataset</strong>[<em>camelCasedName</em>] = <em>string</em>;</li>
- <li>
-  <p>HTML elements에서 사용자가 지정한 data attribute에 직접 설정할 수 있으나 attribute names는 위의 데이터 문법을 반드시 사용해야 합니다.</p>
- </li>
-</ul>
-
-<h2 id="예시">예시</h2>
-
-<pre class="brush: html">&lt;div id="user" data-id="1234567890" data-user="johndoe" data-date-of-birth&gt;John Doe&lt;/div&gt;</pre>
-
-<pre class="brush: js">const el = document.querySelector('#user');
-
-// el.id === 'user'
-// el.dataset.id === '1234567890'
-// el.dataset.user === 'johndoe'
-// el.dataset.dateOfBirth === ''
-
-// set the data attribute
-el.dataset.dateOfBirth = '1960-10-03';
-// Result: el.dataset.dateOfBirth === 1960-10-03
-
-delete el.dataset.dateOfBirth;
-// Result: el.dataset.dateOfBirth === undefined
-
-// 'someDataAttr' in el.dataset === false
-el.dataset.someDataAttr = 'mydata';
-// Result: 'someDataAttr' in el.dataset === true
-</pre>
-
-<h2 id="Specifications">Specifications</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', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No change from latest snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot of  {{SpecName('HTML WHATWG')}}, initial definition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="브라우저_호환성">브라우저 호환성</h2>
-
-<p>{{Compat("api.HTMLElement.dataset")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>The HTML <a href="/en-US/docs/Web/HTML/Global_attributes/data-*"><strong>data-*</strong></a> class of global attributes.</li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Using data attributes</a></li>
-</ul>
diff --git a/files/ko/web/api/htmlelement/innertext/index.html b/files/ko/web/api/htmlelement/innertext/index.html
new file mode 100644
index 0000000000..414fab5c00
--- /dev/null
+++ b/files/ko/web/api/htmlelement/innertext/index.html
@@ -0,0 +1,88 @@
+---
+title: Node.innerText
+slug: Web/API/Node/innerText
+tags:
+  - API
+  - DOM
+  - HTMLElement
+  - Property
+  - Reference
+translation_of: Web/API/HTMLElement/innerText
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<p><span class="seoSummary">{{domxref("HTMLElement")}} 인터페이스의 <code><strong>innerText</strong></code> 속성은 요소와 그 자손의 렌더링 된 텍스트 콘텐츠를 나타냅니다.</span> <code>innerText</code>는 사용자가 커서를 이용해 요소의 콘텐츠를 선택하고 클립보드에 복사했을 때 얻을 수 있는 텍스트의 근삿값을 제공합니다.</p>
+
+<div class="blockIndicator note">
+<p><strong>참고:</strong> <code>innerText</code>는 {{domxref("Node.textContent")}}와 혼동하기 쉬우나 중요한 차이점을 가지고 있습니다. 기본적으로, <code>innerText</code>는 텍스트의 렌더링 후 모습을 인식할 수 있지만 <code>textContent</code>는 그렇지 않습니다.</p>
+</div>
+
+<h2 id="구문">구문</h2>
+
+<pre>const renderedText = <em>htmlElement</em>.innerText
+<em>htmlElement</em>.innerText = <em>string</em>
+</pre>
+
+<h3 id="값">값</h3>
+
+<p>요소의 렌더링 된 텍스트 콘텐츠를 나타내는 {{domxref("DOMString")}}. 요소 자체가 <a href="https://html.spec.whatwg.org/multipage/rendering.html#being-rendered">렌더링 중</a>이 아니라면 {{domxref("Node.textContent")}} 속성의 값과 동일합니다.</p>
+
+<h2 id="예제">예제</h2>
+
+<p>다음 예제는 <code>innerText</code>와 {{domxref("Node.textContent")}}를 비교합니다. <code>innerText</code>가 {{htmlElement("br")}} 태그를 인식하고, 숨겨진 요소를 무시하는 점에 주목하세요.</p>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;h3&gt;원본 요소:&lt;/h3&gt;
+&lt;p id="source"&gt;
+  &lt;style&gt;#source { color: red; }&lt;/style&gt;
+아래에서&lt;br&gt;이 글을&lt;br&gt;어떻게 인식하는지 살펴보세요.
+  &lt;span style="display:none"&gt;숨겨진 글&lt;/span&gt;
+&lt;/p&gt;
+&lt;h3&gt;textContent 결과:&lt;/h3&gt;
+&lt;textarea id="textContentOutput" rows="6" cols="30" readonly&gt;...&lt;/textarea&gt;
+&lt;h3&gt;innerText 결과:&lt;/h3&gt;
+&lt;textarea id="innerTextOutput" rows="6" cols="30" readonly&gt;...&lt;/textarea&gt;</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="brush: js">const source = document.getElementById('source');
+const textContentOutput = document.getElementById('textContentOutput');
+const innerTextOutput = document.getElementById('innerTextOutput');
+
+textContentOutput.innerHTML = source.textContent;
+innerTextOutput.innerHTML = source.innerText;</pre>
+
+<h3 id="결과">결과</h3>
+
+<p>{{EmbedLiveSample("예제", 700, 450)}}</p>
+
+<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', 'dom.html#the-innertext-idl-attribute', 'innerText')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Introduced, based on the <a href="https://github.com/rocallahan/innerText-spec">draft of the innerText specification</a>. See <a href="https://github.com/whatwg/html/issues/465">whatwg/html#465</a> and <a href="https://github.com/whatwg/compat/issues/5">whatwg/compat#5</a> for history.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_Compatibility" name="Browser_Compatibility">브라우저 호환성</h2>
+
+
+
+<p>{{Compat("api.HTMLElement.innerText")}}</p>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li>{{domxref("HTMLElement.outerText")}}</li>
+ <li>{{domxref("Element.innerHTML")}}</li>
+</ul>
diff --git a/files/ko/web/api/htmlelement/style/index.html b/files/ko/web/api/htmlelement/style/index.html
deleted file mode 100644
index 5976dd66bc..0000000000
--- a/files/ko/web/api/htmlelement/style/index.html
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: element.style
-slug: Web/API/HTMLElement/style
-tags:
-  - API
-  - HTML DOM
-  - HTMLElement
-  - Property
-  - Reference
-  - Style
-translation_of: Web/API/ElementCSSInlineStyle/style
----
-<div>{{ APIRef("HTML DOM") }}</div>
-
-<p><code><strong>HTMLElement.style</strong></code> 속성은 요소의 인라인 스타일에 접근하거나 설정할 때 사용할 수 있습니다. 접근자로서는 요소의 인라인 <a href="/ko/docs/Web/HTML/Global_attributes/style"><code>style</code> 속성</a>이 포함한 CSS 선언을 담은 {{domxref("CSSStyleDeclaration")}} 객체를 반환합니다</p>
-
-<h2 id="예제">예제</h2>
-
-<pre class="brush: js">// Set multiple styles in a single statement
-elt.style.cssText = "color: blue; border: 1px solid black";
-// Or
-elt.setAttribute("style", "color:red; border: 1px solid blue;");
-
-// Set specific style while leaving other inline style values untouched
-elt.style.color = "blue";</pre>
-
-<h2 id="명세">명세</h2>
-
-<p><a href="http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-ElementCSSInlineStyle">DOM Level 2 Style: ElementCSSInlineStyle.style</a></p>
-
-<p><a href="https://www.w3.org/TR/cssom-1/#the-elementcssinlinestyle-interface">CSSOM: ElementCSSInlineStyle</a></p>
-
-<h2 id="브라우저_호환성">브라우저 호환성</h2>
-
-<p>{{Compat("api.HTMLElement.style")}}</p>
-
-<h2 id="같이_보기">같이 보기</h2>
-
-<ul>
- <li><a href="/ko/docs/DOM/Using_dynamic_styling_information" title="DOM/Using dynamic styling information">Using dynamic styling information</a></li>
-</ul>
diff --git a/files/ko/web/api/htmlelement/tabindex/index.html b/files/ko/web/api/htmlelement/tabindex/index.html
deleted file mode 100644
index 7cbb0fa1f0..0000000000
--- a/files/ko/web/api/htmlelement/tabindex/index.html
+++ /dev/null
@@ -1,26 +0,0 @@
----
-title: element.tabIndex
-slug: Web/API/HTMLElement/tabIndex
-tags:
-  - DOM
-  - Gecko
-  - Gecko DOM Reference
-translation_of: Web/API/HTMLOrForeignElement/tabIndex
----
-<p>{{ ApiRef() }}</p>
-<h3 id=".EC.9A.94.EC.95.BD" name=".EC.9A.94.EC.95.BD">요약</h3>
-<p>현재 요소의 탭 순서를 get/set.</p>
-<h3 id=".EA.B5.AC.EB.AC.B8" name=".EA.B5.AC.EB.AC.B8">구문</h3>
-<pre class="eval">element.tabIndex =<i>iIndex</i>
-</pre>
-<h3 id=".EB.A7.A4.EA.B0.9C.EB.B3.80.EC.88.98" name=".EB.A7.A4.EA.B0.9C.EB.B3.80.EC.88.98">매개변수</h3>
-<ul>
- <li><code>iIndex</code>는 숫자</li>
-</ul>
-<h3 id=".EC.98.88" name=".EC.98.88">예</h3>
-<pre>b1 = document.getElementById("button1");
-b1.tabIndex = 1;
-</pre>
-<h3 id=".EB.AA.85.EC.84.B8" name=".EB.AA.85.EC.84.B8">명세</h3>
-<p><a class="external" href="http://www.w3.org/TR/2000/WD-DOM-Level-2-HTML-20001113/html.html#ID-40676705">tabIndex </a></p>
-<p>{{ languages( { "en": "en/DOM/element.tabIndex", "pl": "pl/DOM/element.tabIndex" } ) }}</p>