JavaScript 中获取光标位置

1.概念和原理

DOM中并没有直接获取光标位置的方法，那么我们只能间接来获取光标位置。DOM支持获取光标选中的范围，我们可以以此为切入点，来获取或定位光标的位置，当选取范围起始点和结束点一样时，就是光标插入的位置。

1.1. 术语

anchor：选区起点。

focus：选区终点。

range：选区范围，包含整个节点或节点的一部分。

1.2. Selection

Selection 对象表示用户选择的文本范围或插入符号的位置。

Selection 选取的节点范围都是块级节点，input和 textarea 并不能作为 Selection 的节点。

Selection 对象存在于window对象上，可以通过 window.getSelection() 获取示例。

属性：

anchorNode：选区起点的节点。

anchorOffset：选区的起点位置。

focusNode：选区终点的节点。

focusOffset：选区的终点位置。

isCollapsed：起点和终点是否重叠。

rangeCount：选区包含的range数目。

方法

getRangeAt(index)：获取指定的选取范围。

addRange(range)：将一个范围添加到Selection对象中。

removeRange()：移出指定的范围。

removeAllRanges()：移出所有range对象。

collapse(parentNode,offset)：将光标移动到parentNode节点的offset位置。

collapseToStart()：取消当前选区，并把光标定位在原选区的最开始处，如果此时光标所处的位置是可编辑的，且它获得了焦点，则光标会在原地闪烁。

collapseToEnd()：取消当前选区，并将光标定位到原选取的最末位，如果此时光标所处的位置是可编辑的，且它获得了焦点，则光标会在原地闪烁。

extend(node,offset)：将终点位置移动到node节点的offset位置。

modify(alter,direction,granularity)：通过alter方式(move/extend)来改变光标位置，移动方向为direction(left/right)，移动单位为granularity。

containsNode(aNode,aPartlyContained)：判断aNode是否包含在Selection中，aPartlyContained为false表示全包含，为true表示只要部分包含即可。

toString()：