Selection对象

简介

Selection是window.getSelection()或其他方法返回的对象。它表示选中的文本区域，当用户在页面上选择一段文本时，它很可能会跨越多个元素。关于可编辑元素的text selection，可以查看Input，Textarea 和 document.activeElement，这些元素都会返回the parent object returned from window.getSelection()。

Selection 表现为一组 Range 对象，第一个 Range 对象在组中的索引为0，以此类推。 Selection 中的所有成员以 Range 对象上的操作方式定义，这些操作可以像 Range 接口中定义的一样抛出异常，可以通过 'Selection.getRangeAt(index)' 方法从当前的选择集中获得指定索引的 Range。

Selection通常只有一个range，如下：

var selObj = window.getSelection();
var range  = selObj.getRangeAt(0);  

调用Selection.toString()方法，返回selection包含的文本：

var selObj = window.getSelection();
window.alert(selObj);

注意：作为alert方法的参数，会调用selection对象的toString()方法。

概念

anchor：anchor是selection的开始点。当用鼠标创建一个selection时，anchor就是按下鼠标的位置。随着用户用鼠标或键盘改变selection，anchor并不会移动。

focus：focus是selection的结束点。当用鼠标创建一个selection时，focus就是松开鼠标的位置。随着用户用鼠标或键盘改变selection，focus就是selection的结束点。

range：range是文档中一个连续的部分。一个range可以包含完整的节点，也可以包含部分节点，比如文本节点的一部分。用户在某一时刻只能选择一个range，但也可以选择多个range（按住ctrl键）。可以从一个selection中获得一个range对象，也可以通过DOM和编程的方式创建Range对象，然后再把它加入一个selection，或从selection中删除。

 

预知API详情，请移步MDN