Revision 791779 of Window.getSelection()

<div>{{ ApiRef() }}</div>

<h2 id="Summary" name="Summary">Summary</h2>

<p>Returns a selection object representing the range of text selected by the user. <!-- NB. this is nothing to do with the DOM selection list object! What the heck is 'selection list object'? -Nickolay --></p>

<h2 id="Syntax" name="Syntax">Syntax</h2>

<pre class="syntaxbox">
<em>selection</em> = <em>window</em>.getSelection();</pre>

<ul>
 <li><code>selection</code> is a {{domxref("Selection")}} object. When cast to string, either by appending an empty string (<code>""</code>) or using {{jsxref("String.toString()")}}, this object is the text selected.</li>
</ul>

<h2 id="Example" name="Example">Example</h2>

<pre class="brush:js">
function foo() {
    var selObj = window.getSelection(); 
    alert(selObj);
    var selRange = selObj.getRangeAt(0);
    // do stuff with the range
}</pre>

<h2 id="Notes" name="Notes">Notes</h2>

<p>In JavaScript, when an object is passed to a function expecting a string (like {{ Domxref("window.alert()") }} or {{ Domxref("document.write()") }}), the object's {{jsxref("Object.toString", "toString()")}} method is called and the returned value is passed to the function. This can make the object appear to be a string when used with other functions when it is really an object with properties and methods.</p>

<p>In the above example, <code>selObj.toString()</code> is automatically called when it is passed to {{domxref("window.alert()")}}. However, attempting to use a JavaScript <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" title="JS/String">String</a> property or method such as <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length" title="JS/String.length">length</a></code> or <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substr" title="JS/String.substr">substr</a></code> directly on a {{domxref("Selection")}} object will result in an error if it does not have that property or method and may return unexpected results if it does. To use a <code>Selection</code> object as a string, call its <code>toString()</code> method directly:</p>

<pre class="brush:js;gutter:false;">
var selectedText = selObj.toString();</pre>

<ul>
 <li><code>selObj</code> is a <code>Selection</code> object.</li>
 <li><code>selectedText</code> is a string (Selected text).</li>
</ul>

<p>It's also useful to note that you can call {{domxref("Document.getSelection()")}}, which works identically.</p>

<h2 id="Browser_compatibility">Browser compatibility</h2>

<p>{{ CompatibilityTable() }}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>Yes</td>
   <td>Yes</td>
   <td>From version 9</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
   <td>{{ CompatUnknown() }}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="Specification" name="Specification">Specification</h2>

<p><a href="https://dvcs.w3.org/hg/editing/raw-file/tip/editing.html#selections" style="line-height: 1.5;">HTML Editing APIs</a></p>

<h2 id="See_also" name="See_also">See also</h2>

<ul>
 <li>{{domxref("Selection")}}</li>
 <li>{{domxref("Range")}}</li>
 <li>{{domxref("Document.getSelection()")}}</li>
</ul>
<!--languages({
"es": "es/DOM/window.getSelection",
"fr": "fr/DOM/window.getSelection",
"it": "it/DOM/window.getSelection",
"ja": "ja/DOM/window.getSelection",
"pl": "pl/DOM/window.getSelection"
}) -->