initial commit

7 files changed, 564 insertions, 0 deletions

diff --git a/files/ko/web/api/nodelist/entries/index.html b/files/ko/web/api/nodelist/entries/index.html
new file mode 100644
index 0000000000..8e9387311c
--- /dev/null
+++ b/files/ko/web/api/nodelist/entries/index.html
@@ -0,0 +1,70 @@
+---
+title: NodeList.entries()
+slug: Web/API/NodeList/entries
+translation_of: Web/API/NodeList/entries
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p><code><strong>NodeList.entries()</strong></code> 메서드는 이 객체에 포함된 모든 key/value 쌍을 통과하는 {{jsxref("Iteration_protocols",'iterator')}} 를 반환합니다. 이 값(value)은 {{domxref("Node")}} 객체입니다.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">list.entries();</pre>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>{{jsxref("Iteration_protocols","iterator")}} 를 반환합니다.</p>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: js;highlight:[12]">var node = document.createElement("div");
+var kid1 = document.createElement("p");
+var kid2 = document.createTextNode("hey");
+var kid3 = document.createElement("span");
+node.appendChild(kid1);
+node.appendChild(kid2);
+node.appendChild(kid3);
+
+var list = node.childNodes;
+
+// Using for..of
+for(var entry of list.entries()) {
+  console.log(entry);
+}
+</pre>
+
+<p>결과는 다음과 같습니다:</p>
+
+<pre>Array [ 0, &lt;p&gt; ]
+Array [ 1, #text "hey" ]
+Array [ 2, &lt;span&gt; ]</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('DOM WHATWG','#interface-nodelist','entries() (as iterable&lt;Node&gt;)')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("api.NodeList.entries")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("Node")}}</li>
+ <li>{{domxref("NodeList")}}</li>
+</ul>
diff --git a/files/ko/web/api/nodelist/foreach/index.html b/files/ko/web/api/nodelist/foreach/index.html
new file mode 100644
index 0000000000..b12325d134
--- /dev/null
+++ b/files/ko/web/api/nodelist/foreach/index.html
@@ -0,0 +1,118 @@
+---
+title: NodeList.prototype.forEach()
+slug: Web/API/NodeList/forEach
+translation_of: Web/API/NodeList/forEach
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p>{{domxref("NodeList")}} 인터페이스의 <strong><code>forEach()</code></strong> 메서드는 리스트 내의 각각의 값 쌍에 대해 매개 변수에 지정된 콜백을 삽입 순서로 호출합니다.</p>
+
+<h2 id="문법Syntax">문법Syntax</h2>
+
+<pre class="syntaxbox"><em>NodeList.</em>forEach<em>(callback[, thisArg]);</em>
+</pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>각각의 요소에 대해 실행하는 함수로, 3개의 인수(arguments)를 갖습니다:
+ <dl>
+  <dt><em><code>currentValue</code></em></dt>
+  <dd>NodeList에서 처리중인 현재 요소(element)입니다.</dd>
+  <dt><code><em>currentIndex</em></code></dt>
+  <dd>NodeList에서 처리중인 현재 요소의 인덱스입니다.</dd>
+  <dt><em><code>listObj</code></em></dt>
+  <dd><code>forEach()</code> 가 적용되고 있는 NodeList 객체입니다. </dd>
+ </dl>
+ </dd>
+ <dt><code>thisArg</code><code> {{Optional_inline}}</code></dt>
+ <dd><code>callback</code> 을 실행할 때 {{jsxref("this")}} 에 대입할 값입니다.</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>{{jsxref('undefined')}}.</p>
+
+<h2 id="Exceptions">Exceptions</h2>
+
+<p><em>None</em>.</p>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: js;highlight:[6]">var node = document.createElement("div");
+var kid1 = document.createElement("p");
+var kid2 = document.createTextNode("hey");
+var kid3 = document.createElement("span");
+
+node.appendChild(kid1);
+node.appendChild(kid2);
+node.appendChild(kid3);
+
+var list = node.childNodes;
+
+list.forEach(
+  function(currentValue, currentIndex, listObj) {
+    console.log(currentValue + ', ' + currentIndex + ', ' + this);
+  },
+  'myThisArg'
+);</pre>
+
+<p>결과는 다음과 같습니다.</p>
+
+<pre>[object HTMLParagraphElement], 0, myThisArg
+[object Text], 1, myThisArg
+[object HTMLSpanElement], 2, myThisArg</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>이 {{Glossary("Polyfill","polyfill")}} 은 <a href="https://caniuse.com/#search=es5">ES5</a> 를 지원하는 모든 브라우저에서 동작합니다:</p>
+
+<pre class="brush: js">if (window.NodeList &amp;&amp; !NodeList.prototype.forEach) {
+    NodeList.prototype.forEach = function (callback, thisArg) {
+        thisArg = thisArg || window;
+        for (var i = 0; i &lt; this.length; i++) {
+            callback.call(thisArg, this[i], i, this);
+        }
+    };
+}</pre>
+
+<p>또는</p>
+
+<pre class="brush: js">if (window.NodeList &amp;&amp; !NodeList.prototype.forEach) {
+    NodeList.prototype.forEach = Array.prototype.forEach;
+}</pre>
+
+<p>The above behavior is how many browsers actually implement NodeList.prototype.forEach (Chrome, for example).</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("WebIDL", "#es-forEach", "forEach")}}</td>
+   <td>{{Spec2("WebIDL")}}</td>
+   <td>Defines <code>forEach</code> on <code>iterable</code> declarations</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_Compatibility">Browser Compatibility</h2>
+
+
+
+<p>{{Compat("api.NodeList.forEach")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("Node")}}</li>
+ <li>{{domxref("NodeList")}}</li>
+</ul>
diff --git a/files/ko/web/api/nodelist/index.html b/files/ko/web/api/nodelist/index.html
new file mode 100644
index 0000000000..a0829a7eca
--- /dev/null
+++ b/files/ko/web/api/nodelist/index.html
@@ -0,0 +1,153 @@
+---
+title: NodeList
+slug: Web/API/NodeList
+tags:
+  - DOM
+  - Interface
+translation_of: Web/API/NodeList
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p><strong><code>NodeList</code> </strong>객체는 일반적으로 {{domxref("element.childNodes")}}와 같은 속성(property)과 {{domxref("document.querySelectorAll")}} 와 같은 메서드에 의해 반환되는  <a href="https://developer.mozilla.org/ko/docs/Glossary/Node/DOM">노드</a>의 콜렉션입니다.</p>
+
+<div class="note">
+<p><code>NodeList</code> 가 <code>Array</code> 는 아니지만, <code>forEach()</code> 를 사용하여 반복할 수 있습니다. 또한 {{jsxref("Array.from()")}} 을 사용하여 <code>Array</code> 로 변환 할 수도 있습니다.</p>
+
+<p>그러나 일부 오래된 브라우저는 아직<code>NodeList.forEach()</code> 또는 <code>Array.from()</code> 를 구현하지 않았습니다. 이것은 {{jsxref("Array.forEach()", "Array.prototype.forEach()")}} 를 사용하여 회피할 수 있습니다. — 이 <a href="https://developer.mozilla.org/ko/docs/Web/API/NodeList$edit#Example">문서</a>의 예제를 참조하세요.</p>
+</div>
+
+<p>경우에 따라, <code>NodeList</code>는 라이브 콜렉션으로, DOM의 변경 사항을 실시간으로 콜렉션에 반영합니다. 예를 들어, {{domxref("Node.childNodes")}} 는 실시간입니다:</p>
+
+<pre class="brush: js notranslate">var parent = document.getElementById('parent');
+var child_nodes = parent.childNodes;
+console.log(child_nodes.length); // let's assume "2"
+parent.appendChild(document.createElement('div'));
+console.log(child_nodes.length); // should output "3"
+</pre>
+
+<p>다른 경우 <code>NodeList</code>는 정적 콜렉션입니다. DOM을 변경해도 콜렉션 내용에는 영향을 주지 않습니다. {{domxref("document.querySelectorAll()")}} 은 정적 <code>NodeList</code>를 반환합니다.</p>
+
+<p><code>NodeList</code>의 항목(items)을 순회(iterate)하거나, 특히 리스트의 길이를 캐시(cache)해야 할 때, 이 구분을 유지하는것이 좋습니다.</p>
+
+<h2 id="속성Properties">속성(Properties)</h2>
+
+<dl>
+ <dt>{{domxref("NodeList.length")}}</dt>
+ <dd><code>NodeList</code>의 노드의 개수를 반환합니다.</dd>
+</dl>
+
+<h2 id="메서드Methods">메서드(Methods)</h2>
+
+<dl>
+ <dt>{{domxref("NodeList.item()")}}</dt>
+ <dd>리스트 내 항목(item)의 인덱스를 반환하고, 인덱스가 범위 외의 경우일 땐 <code>null</code>을 반환합니다.</dd>
+ <dd><code>nodeList[idx]</code>의 대안으로 사용할 수 있습니다.(<code>i</code> 가범위를 벗어날 때(out-of-bounds) <code>undefined</code> 를 반환합니다.) 이것은 비 자바스크립트 언어 DOM 구현에 유용합니다.</dd>
+ <dt>{{domxref("NodeList.entries()")}}</dt>
+ <dd>{{jsxref("Iteration_protocols","iterator")}} 를 반환하여 코드가 콜렉션에 포함된 모든 키/값 쌍을 순회할 수 있도록 합니다. (이 경우 키는 0부터 시작하는 숫자이고, 값은 노드가 됩니다.)</dd>
+ <dt>{{domxref("NodeList.forEach()")}}</dt>
+ <dd><code>NodeList</code>의 요소(element)마다 한 번씩, 인자로 전달 받은 함수를 실행하여 요소를 인수(argument)로 함수에 전달합니다.</dd>
+ <dt>{{domxref("NodeList.keys()")}}</dt>
+ <dd>{{jsxref("Iteration_protocols", "iterator")}}를 반환하여 콜렉션에 포함된 키/값 쌍의 모든 키를 코드가 순회하도록 합니다. (이 경우 키는 0부터 시작하는 숫자입니다.)</dd>
+ <dt>{{domxref("NodeList.values()")}}</dt>
+ <dd>콜렉션에 포함된 키/값 쌍의 모든 값(nodes)을 코드가 순회할 수 있게 해주는 {{jsxref("Iteration_protocols", "iterator")}}를 반환합니다.</dd>
+</dl>
+
+<h2 id="Example">Example</h2>
+
+<p>for 루프를 사용하여 <code>NodeList</code>의 항목을 반복할 수 있습니다.</p>
+
+<pre class="brush: js notranslate">for (var i = 0; i &lt; myNodeList.length; ++i) {
+  var item = myNodeList[i];  // Calling myNodeList.item(i) isn't necessary in JavaScript
+}
+</pre>
+
+<p><strong>리스트의 항목(items)을 열거하기 위해 <a href="/en-US/docs/JavaScript/Reference/Statements/for...in" title="JavaScript/ Reference/Statements/for...in">for...in</a> 또는 <a href="/en-US/docs/JavaScript/Reference/Statements/for_each...in" title="JavaScript/ Reference/Statements/for each...in">for each...in</a>를 사용하지 않길 바랍니다.</strong> <code>NodeList</code>의 길이와 항목 속성까지 열거합니다. 또한 스크립트가 요소({{domxref("element")}}) 객체만 처리한다고 가정하면 오류가 발생할 수 있습니다. 게다가, <code>for..in</code>은 고정된 순서로 각 속성들을 접근한다는 보장이 없습니다.</p>
+
+<p><code><a href="/en-US/docs/JavaScript/Reference/Statements/for...of" title="/en-US/docs/JavaScript/Reference/Statements/for...of">for...of</a></code> 루프는 <code>NodeList</code> 객체를 올바르게 반복합니다.</p>
+
+<pre class="brush: js notranslate">var list = document.querySelectorAll( 'input[type=checkbox]' );
+for (var item of list) {
+  item.checked = true;
+}</pre>
+
+<p>최신 브라우저는 반복자(iterator) 메서드인 {{domxref("NodeList.forEach()", "forEach()")}}만이 아니라, {{domxref("NodeList.entries()", "entries()")}}, {{domxref("NodeList.values()", "values()")}}, {{domxref("NodeList.keys()", "keys()")}} 까지도 지원합니다.</p>
+
+<p>인터넷 익스플로러의 호환을 위해서는 {{jsxref("Array.forEach()", "Array.prototype.forEach")}} 를 사용하는 방법도 있습니다.</p>
+
+<pre class="brush: js notranslate"><code>var list = document.querySelectorAll( 'input[type=checkbox]' );
+Array.prototype.forEach.call(list, function (item) {
+  item.checked = true;
+});</code>
+</pre>
+
+<h2 id="Array로_변환하는_법">Array로 변환하는 법</h2>
+
+<p>NodeList의 컨텐츠를 Array의 메소드를 통해 다루는 것이 더 쉬울 때도 있다. 아래는 NodeList 객체를 Array로 변환하는 기법이다.</p>
+
+<pre class="brush: js notranslate">var div_list = document.querySelectorAll('div'); // returns NodeList
+var div_array = Array.prototype.slice.call(div_list); // converts NodeList to Array</pre>
+
+<h2 id="Specifications" name="Specifications">NodeList prototype</h2>
+
+<p>NodeList에 프로토타입을 추가할 수도 있다.</p>
+
+<pre class="brush: js notranslate"><code>var elements = document.querySelectorAll(".suggestions");
+
+NodeList.prototype.addEventListener = function(event, func) {
+    this.forEach(function(content, item) {
+       content.addEventListener(event, func);
+    });
+}
+
+function log() {
+    console.log(this, " was clicked");
+}
+
+elements.addEventListener("click", log);
+//or
+elements.addEventListener("click", function() {
+    console.log(this, "  awas clicked");
+});
+// 클릭된 요소로부터 출력될 요소는 둘 모두 HTML 요소가 된다.</code></pre>
+
+<p><font face="consolas, Liberation Mono, courier, monospace">forEach에 대한 자세한 내용은 </font><a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach" title="Web/JavaScript/Reference/Global_Objects/Array/forEach">Array.prototype.forEach()</a>를 참조하길 바란다.</p>
+
+<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('DOM WHATWG', '#interface-nodelist', 'NodeList')}}</td>
+   <td>{{ Spec2('DOM WHATWG') }}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Core', 'core.html#ID-536297177', 'NodeList')}}</td>
+   <td>{{ Spec2('DOM3 Core') }}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Core', 'core.html#ID-536297177', 'NodeList')}}</td>
+   <td>{{ Spec2('DOM2 Core') }}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM1', 'level-one-core.html#ID-536297177', 'NodeList')}}</td>
+   <td>{{ Spec2('DOM1') }}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+
+
+<p>{{Compat("api.NodeList")}}</p>
diff --git a/files/ko/web/api/nodelist/item/index.html b/files/ko/web/api/nodelist/item/index.html
new file mode 100644
index 0000000000..8e46ba48f4
--- /dev/null
+++ b/files/ko/web/api/nodelist/item/index.html
@@ -0,0 +1,44 @@
+---
+title: NodeList.item()
+slug: Web/API/NodeList/item
+translation_of: Web/API/NodeList/item
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p class="summary"><a href="/en-US/docs/Web/API/NodeList"><code>NodeList</code></a> 의 node를 index로 돌려줍니다. 이 메서드는 인수(arguments)를 제공하는 한 exceptions 을 throw 하지 않습니다. index가 범위를 벗어나면 <code>null</code> 값이 반환되고, 인수가 제공되지 않으면 <code>TypeError</code> 가 throw 됩니다.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><em>nodeItem</em> = <em>nodeList</em>.item(<em>index</em>)
+</pre>
+
+<ul>
+ <li><code>nodeList</code> 는 <code>NodeList</code> 입니다. 일반적으로 <a href="/en-US/docs/Web/API/Node/childNodes" title="childNodes">childNodes</a> 와 같은 다른 DOM 속성(property) 또는 메서드에서 가져옵니다.</li>
+ <li><code>index</code> 는 fetch될 node의 index입니다. index는 0 에서 부터 시작합니다.</li>
+ <li><code>nodeItem</code> 은 <code>item</code> 메서드가 반환 한 <code>nodeList</code> 의 node <code>index</code> 입니다.</li>
+</ul>
+
+<h2 id="Alternate_Syntax">Alternate Syntax</h2>
+
+<p>자바스크립트는 NodeList 에서 index를 얻기 위한, 배열과 같은 브라켓 문법([])을 제공합니다 :</p>
+
+<pre class="eval"><em>nodeItem</em> = <em>nodeList</em>[<em>index</em>]
+</pre>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: js">var tables = document.getElementsByTagName("table");
+var firstTable = tables.item(1); // or simply tables[1] - returns the <strong>second</strong> table in the DOM
+</pre>
+
+<h2 id="Specification">Specification</h2>
+
+<p><a class="external" href="https://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#method-item">DOM Level 1 Core: NodeList.item()</a></p>
+
+<p><a class="external" href="https://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-844377136">DOM Level 2 Core: NodeList.item()</a></p>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("api.NodeList.item")}}</p>
diff --git a/files/ko/web/api/nodelist/keys/index.html b/files/ko/web/api/nodelist/keys/index.html
new file mode 100644
index 0000000000..36160b9e1b
--- /dev/null
+++ b/files/ko/web/api/nodelist/keys/index.html
@@ -0,0 +1,72 @@
+---
+title: NodeList.keys()
+slug: Web/API/NodeList/keys
+translation_of: Web/API/NodeList/keys
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p><code><strong>NodeList.keys()</strong></code> 메서드는 이 객체에 포함된 모든 키를 통과할 수 있는 {{jsxref("Iteration_protocols",'iterator')}} 를 반환합니다. 이 키는 부호없는 정수형(<code>unsigned integer</code>) 입니다.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">nodeList.keys();</pre>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>{{jsxref("Iteration_protocols","iterator")}}를 반환합니다.</p>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: js;highlight:[13]">var node = document.createElement("div");
+var kid1 = document.createElement("p");
+var kid2 = document.createTextNode("hey");
+var kid3 = document.createElement("span");
+
+node.appendChild(kid1);
+node.appendChild(kid2);
+node.appendChild(kid3);
+
+var list = node.childNodes;
+
+// Using for..of
+for(var key of list.keys()) {
+   console.log(key);
+}
+</pre>
+
+<p>결과는 다음과 같습니다 :</p>
+
+<pre>0
+1
+2
+</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('DOM WHATWG','#interface-nodelist','keys() (as iterable)')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("api.NodeList.keys")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("Node")}}</li>
+ <li>{{domxref("NodeList")}}</li>
+</ul>
diff --git a/files/ko/web/api/nodelist/length/index.html b/files/ko/web/api/nodelist/length/index.html
new file mode 100644
index 0000000000..4e931dd73e
--- /dev/null
+++ b/files/ko/web/api/nodelist/length/index.html
@@ -0,0 +1,35 @@
+---
+title: element.length
+slug: Web/API/NodeList/length
+tags:
+  - DOM
+  - Gecko
+  - Gecko DOM Reference
+translation_of: Web/API/NodeList/length
+---
+<p>{{ ApiRef() }}</p>
+<h3 id=".EC.9A.94.EC.95.BD" name=".EC.9A.94.EC.95.BD">요약</h3>
+<p><code>length</code>는 <code>NodeList</code>의 항목수를 반환합니다.</p>
+<h3 id=".EA.B5.AC.EB.AC.B8" name=".EA.B5.AC.EB.AC.B8">구문</h3>
+<pre class="eval"><i>numItems</i> =<i>nodeList</i>.length
+</pre>
+<ul>
+ <li><code>numItems</code>은 <code>NodeList</code>의 항목수를 나타내는 정수값입니다.</li>
+</ul>
+<h3 id=".EC.98.88" name=".EC.98.88">예</h3>
+<pre>// 문서의 모든 paragraph
+var items = document.getElementsByTagName("p");
+// 목록의 각 항목에,
+// HTML의 문자열로 전체 요소를 추가
+var gross = "";
+for (var i = 0; i &lt; items.length; i++) {
+  gross += items[i].innerHTML;
+}
+// gross는 이제 모두 paragraph을 위한 HTML
+</pre>
+<h3 id=".EC.A3.BC.EC.9D.98" name=".EC.A3.BC.EC.9D.98">주의</h3>
+<p>reference에서 이 페이지의 위치에도 불구하고, <code>length</code>는 <a href="ko/DOM/element">Element</a>의 프로퍼티가 아니고, <code>NodeList</code>의 프로퍼티입니다. NodeList 개체는 <a href="ko/DOM/document.getElementsByTagName">document.getElementsByTagName</a>과 같은 많은 DOM 메소드에서 반환됩니다.</p>
+<p><code>length</code>는 DOM 프로그래밍에서 아주 흔한 프로퍼티입니다. 위 예에서처럼 목록의 길이(적어도 있는 지 보기 위해)를 조사하고 for 루프에서 훑개(반복자, iterator)로 널리 쓰입니다.</p>
+<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/REC-DOM-Level-2-Core-20001113/core.html#ID-203510337">length</a></p>
+<p>{{ languages( { "en": "en/DOM/element.length", "pl": "pl/DOM/element.length" } ) }}</p>
diff --git a/files/ko/web/api/nodelist/values/index.html b/files/ko/web/api/nodelist/values/index.html
new file mode 100644
index 0000000000..5613e630ae
--- /dev/null
+++ b/files/ko/web/api/nodelist/values/index.html
@@ -0,0 +1,72 @@
+---
+title: NodeList.values()
+slug: Web/API/NodeList/values
+translation_of: Web/API/NodeList/values
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p><code><strong>NodeList.values()</strong></code> 메서드는 이 객체에 포함된 모든 값을 통과할 수 있는 {{jsxref("Iteration_protocols",'iterator')}}를 반환합니다. 값은 {{domxref("Node")}} 객체 입니다.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">nodeList.values();</pre>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>{{jsxref("Iteration_protocols","iterator")}}를 반환합니다.</p>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: js;highlight:[13]">var node = document.createElement("div");
+var kid1 = document.createElement("p");
+var kid2 = document.createTextNode("hey");
+var kid3 = document.createElement("span");
+
+node.appendChild(kid1);
+node.appendChild(kid2);
+node.appendChild(kid3);
+
+var list = node.childNodes;
+
+// Using for..of
+for(var value of list.values()) {
+  console.log(value);
+}
+</pre>
+
+<p>결과는 다음과 같습니다 :</p>
+
+<pre>&lt;p&gt;
+#text "hey"
+&lt;span&gt;
+</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('DOM WHATWG','#interface-nodelist','values() (as iterable&lt;Node&gt;)')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("api.NodeList.values")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("Node")}}</li>
+ <li>{{domxref("NodeList")}}</li>
+</ul>