2 files changed, 210 insertions, 0 deletions
diff --git a/files/ko/web/api/range/index.html b/files/ko/web/api/range/index.html
new file mode 100644
index 0000000000..48f236762a
--- /dev/null
+++ b/files/ko/web/api/range/index.html
@@ -0,0 +1,142 @@
+---
+title: range
+slug: Web/API/Range
+tags:
+  - API
+  - DOM
+  - Reference
+translation_of: Web/API/Range
+---
+<p>{{ APIRef("DOM") }}</p>
+
+<p><strong><code>Range</code></strong> 객체는 주어진 document 내의 텍스트 노드들의 부분들(parts)과 document의 단편화에 포함된 노드들을 나타내고 있다.</p>
+
+<p>Range 오브젝트는 <code><a href="ko/DOM/document">Document</a></code> 객체에 포함되어 있는 <code><a href="ko/DOM/document.createRange">createRange</a></code> 메소드를 사용하여 생성할 수 있다. 또한 <code><a href="ko/DOM/Selection">selection</a></code> 객체에 포함되어 있는 <code><a href="ko/DOM/Selection/getRangeAt">getRangeAt</a></code> 메소드를 사용하여 추출할 수 있다.</p>
+
+<p>{{domxref("Range.Range()", "Range()")}} 생성자 또한 사용 가능하다.</p>
+
+<h2 id="Properties" name="Properties">속성</h2>
+
+<dl>
+ <dt><a href="ko/DOM/range.collapsed">collapsed</a></dt>
+ <dd>Range의 시작점과 끝점이 같인 위치인지를 알 수 있는 boolean 값을 반환한다.</dd>
+ <dt><a href="ko/DOM/range.commonAncestorContainer">commonAncestorContainer</a></dt>
+ <dd>startContainer와 endContainer 노드들을 포함한 최상위 노드를 반환한다.</dd>
+ <dt><a href="ko/DOM/range.endContainer">endContainer</a></dt>
+ <dd>Range의 끝 위치를 포함하는 Node를 반환한다.</dd>
+ <dt><a href="ko/DOM/range.endOffset">endOffset</a></dt>
+ <dd>endContainer 안에 있는 Range 끝을 나타내는 숫자(offset)를 반환한다.</dd>
+ <dt><a href="ko/DOM/range.startContainer">startContainer</a></dt>
+ <dd>Range의 시작 위치를 포함하는 Node를 반환한다.</dd>
+ <dt><a href="ko/DOM/range.startOffset">startOffset</a></dt>
+ <dd>startContainer 안에 있는 Range 시작을 나타내는 숫자(offset)를 반환한다.</dd>
+</dl>
+
+<h2 id="생성자">생성자</h2>
+
+<dl>
+ <dt>{{ domxref("Range.Range()", "Range()") }} {{experimental_inline}}</dt>
+ <dd><code>Range</code> 객체의 시작과 끝에 따라 전역 {{domxref("Document")}} 와 함께 <code>Range</code> 객체를 반환한다.</dd>
+</dl>
+
+<h2 id="Methods" name="Methods">메서드</h2>
+
+<p><em>상속한 메서드는 없다.</em></p>
+
+<dl>
+ <dt>{{ domxref("Range.setStart()")}}</dt>
+ <dd><code>Range<font face="Open Sans, Arial, sans-serif"> 의 시작 위치를 설정한다</font></code>.</dd>
+ <dt>{{ domxref("Range.setEnd()")}}</dt>
+ <dd><code>Range<font face="Open Sans, Arial, sans-serif"> 의 끝 위치를 설정한다</font></code>.</dd>
+ <dt>{{ domxref("Range.setStartBefore()")}}</dt>
+ <dd>다른 {{ domxref("Node") }} 와 관계가 있는 <code>Range<font face="Open Sans, Arial, sans-serif"> 의 시작 위치를 설정한다</font></code>.</dd>
+ <dt>{{ domxref("Range.setStartAfter()")}}</dt>
+ <dd>다른 {{ domxref("Node") }} 와 관계가 있는 <code>Range<font face="Open Sans, Arial, sans-serif"> 의 시작 위치를 설정한다</font></code>.</dd>
+ <dt>{{ domxref("Range.setEndBefore()")}}</dt>
+ <dd>다른 {{ domxref("Node") }} 와 관계가 있는 <code>Range<font face="Open Sans, Arial, sans-serif"> 의 끝 위치를 설정한다</font></code>.</dd>
+ <dt>{{ domxref("Range.setEndAfter()")}}</dt>
+ <dd>다른 {{ domxref("Node") }} 와 관계가 있는 <code>Range<font face="Open Sans, Arial, sans-serif"> 의 끝 위치를 설정한다</font></code>.</dd>
+ <dt>{{ domxref("Range.selectNode()")}}</dt>
+ <dd><code>Range<font face="Open Sans, Arial, sans-serif"> 에 </font></code>{{ domxref("Node") }} 와 그것의 내용물을 포함 시킨<code><font face="Open Sans, Arial, sans-serif">다</font></code>.</dd>
+ <dt>{{ domxref("Range.selectNodeContents()")}}</dt>
+ <dd><code>Range<font face="Open Sans, Arial, sans-serif"> 에 </font></code>{{ domxref("Node") }} 의 내용물을 포함 시킨<code><font face="Open Sans, Arial, sans-serif">다</font></code>.</dd>
+ <dt>{{ domxref("Range.collapse()")}}</dt>
+ <dd><code>Range</code> 의 경계 지점 중 하나로 영역을 붕괴 시킨다.</dd>
+ <dt>{{ domxref("Range.cloneContents()")}}</dt>
+ <dd><code>Range</code> 의 노드들을 복사하여 {{ domxref("DocumentFragment") }} 를 반환한다.</dd>
+ <dt>{{ domxref("Range.deleteContents()")}}</dt>
+ <dd>{{ domxref("Document") }} 로 부터 <code>Range</code> 의 컨텐츠들을 삭제한다.</dd>
+ <dt>{{ domxref("Range.extractContents()")}}</dt>
+ <dd>{{ domxref("Document") }} 트리로 부터 <code>Range</code> 의 컨텐츠들을 domxref("DocumentFragment") }} 로 이동시킨다.</dd>
+ <dt>{{ domxref("Range.insertNode()")}}</dt>
+ <dd><code>Range</code> 의 맨 앞에 {{ domxref("Node") }}를 삽입한다.</dd>
+ <dt>{{ domxref("Range.surroundContents()")}}</dt>
+ <dd>Moves content of a <code>Range</code> into a new {{ domxref("Node") }}.</dd>
+ <dt>{{ domxref("Range.compareBoundaryPoints()")}}</dt>
+ <dd>Compares the boundary points of the <code>Range</code> with another <code>Range</code>.</dd>
+ <dt>{{ domxref("Range.cloneRange()")}}</dt>
+ <dd>Returns a <code>Range</code> object with boundary points identical to the cloned <code>Range</code>.</dd>
+ <dt>{{ domxref("Range.detach()")}}</dt>
+ <dd>Releases the <code>Range</code> from use to improve performance.</dd>
+ <dt>{{ domxref("Range.toString()")}}</dt>
+ <dd>Returns the text of the <code>Range</code>.</dd>
+ <dt>{{ domxref("Range.compareNode()")}} {{ Obsolete_inline }}{{non-standard_inline}}</dt>
+ <dd>Returns a constant representing whether the {{domxref("Node")}} is before, after, inside, or surrounding the range.</dd>
+ <dt>{{ domxref("Range.comparePoint()")}} {{experimental_inline}}</dt>
+ <dd>Returns -1, 0, or 1 indicating whether the point occurs before, inside, or after the <code>Range</code>.</dd>
+ <dt>{{ domxref("Range.createContextualFragment()")}}{{experimental_inline}}</dt>
+ <dd>Returns a {{ domxref("DocumentFragment") }} created from a given string of code.</dd>
+ <dt>{{ domxref("Range.getBoundingClientRect()") }} {{experimental_inline}}</dt>
+ <dd>Returns a {{ domxref("ClientRect") }} object which bounds the entire contents of the <code>Range</code>; this would be the union of all the rectangles returned by {{ domxref("range.getClientRects()") }}.</dd>
+ <dt>{{ domxref("Range.getClientRects()") }} {{experimental_inline}}</dt>
+ <dd>Returns a list of {{ domxref("ClientRect") }} objects that aggregates the results of {{ domxref("Element.getClientRects()") }} for all the elements in the <code>Range</code>.</dd>
+ <dt>{{ domxref("Range.intersectsNode()")}} {{experimental_inline}}</dt>
+ <dd>Returns a <code>boolean</code> indicating whether the given node intersects the <code>Range</code>.</dd>
+ <dt>{{ domxref("Range.isPointInRange()")}} {{experimental_inline}}</dt>
+ <dd>Returns a <code>boolean</code> indicating whether the given point is in the <code>Range</code>.</dd>
+</dl>
+
+<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('DOM WHATWG', '#interface-range', 'Range')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Do not use <code>RangeException</code> anymore, use <code>DOMException</code> instead.<br>
+    Made the second parameter of <code>collapse()</code> optional.<br>
+    Added the methods <code>isPointInRange()</code>, <code>comparePoint()</code>, and <code>intersectsNode()</code>.<br>
+    Added the constructor <code>Range()</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM Parsing', '#extensions-to-the-range-interface', 'Extensions to Range')}}</td>
+   <td>{{Spec2('DOM Parsing')}}</td>
+   <td>Added the method <code>createContextualFragment()</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSSOM View', '#extensions-to-the-range-interface', 'Extensions to Range')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td>Added the methods <code>getClientRects()</code> and <code>getBoundingClientRect()</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Traversal_Range', 'ranges.html#Level-2-Range-Interface', 'Range')}}</td>
+   <td>{{Spec2('DOM2 Traversal_Range')}}</td>
+   <td>Initial specification.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<p>{{Compat("api.Range")}}</p>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/DOM/DOM_Reference" title="/en-US/docs/DOM/DOM_Reference">The DOM interfaces index</a></li>
+</ul>
diff --git a/files/ko/web/api/range/selectnodecontents/index.html b/files/ko/web/api/range/selectnodecontents/index.html
new file mode 100644
index 0000000000..380d600622
--- /dev/null
+++ b/files/ko/web/api/range/selectnodecontents/index.html
@@ -0,0 +1,68 @@
+---
+title: Range.selectNodeContents()
+slug: Web/API/Range/selectNodeContents
+tags:
+  - API
+  - DOM
+  - Method
+  - Range
+translation_of: Web/API/Range/selectNodeContents
+---
+<div>{{ApiRef("DOM")}}</div>
+
+<p><strong><code>Range.selectNodeContents()</code></strong>는 {{domxref("Node")}}의 내용을 포함하는 {{domxref("Range")}}를 설정합니다.</p>
+
+<p>부모 {{ domxref("Node") }} 의 start, end 값이 Reference가 됩니다. <code>startOffset</code> 은 0이고, <code>endOffset</code> 은 Child Node의 수 혹은 Reference Node에 포함되어 있는 Child Node의 수가 됩니다.</p>
+
+<h2 id="구문">구문</h2>
+
+<pre class="syntaxbox"><em>range</em>.selectNodeContents(<em>referenceNode</em>);
+</pre>
+
+<h3 id="Parameters" name="Parameters">매개변수</h3>
+
+<dl>
+ <dt><code><em>referenceNode</em></code></dt>
+ <dd>{{ domxref("Range") }} 로 선택될 내용의 {{ domxref("Node") }} </dd>
+</dl>
+
+<h2 id="Example" name="Example">예제</h2>
+
+<pre class="brush: js">range = document.createRange();
+referenceNode = document.getElementsByTagName("div")[0];
+range.selectNodeContents(referenceNode);
+</pre>
+
+<h2 id="Specification" name="Specification">명세</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', '#dom-range-selectnodecontents', 'Range.selectNodeContents()')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>No change.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-selectNodeContents', 'Range.selectNodeContents()')}}</td>
+   <td>{{Spec2('DOM2 Traversal_Range')}}</td>
+   <td>Initial specification.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+
+
+<p>{{Compat("api.Range.selectNodeContents")}}</p>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li><a href="/en-US/docs/DOM/DOM_Reference" title="/en-US/docs/DOM/DOM_Reference">The DOM interfaces index</a></li>
+</ul>