【前端学习记录】如何选中文本为其添加类名

window.getSelection()

getSelection() 方法，可以确定实际选择的文本。
这个方法是 window 对象和 document 对象的属性，调用它会返回一个表示当前选择文本的 Selection对象。
每个 Selection 对象都有下列属性。

anchorNode ：选区起点所在的节点。
anchorOffset ：在到达选区起点位置之前跳过的 anchorNode 中的字符数量。
focusNode ：选区终点所在的节点。
focusOffset ： focusNode 中包含在选区之内的字符数量。
isCollapsed ：布尔值，表示选区的起点和终点是否重合。
rangeCount ：选区中包含的 DOM 范围的数量
addRange(range) ：将指定的 DOM 范围添加到选区中。
collapse(node, offset) ：将选区折叠到指定节点中的相应的文本偏移位置。
collapseToEnd() ：将选区折叠到终点位置。
collapseToStart() ：将选区折叠到起点位置。
containsNode(node) ：确定指定的节点是否包含在选区中。
deleteFromDocument() ：从文档中删除选区中的文本，与 document.execCommand(“delete”,false, null) 命令的结果相同。
extend(node, offset) ：通过将 focusNode 和 focusOffset 移动到指定的值来扩展选区。
getRangeAt(index) ：返回索引对应的选区中的 DOM 范围。
removeAllRanges() ：从选区中移除所有 DOM 范围。实际上，这样会移除选区，因为选区中至少要有一个范围。
reomveRange(range) ：从选区中移除指定的 DOM 范围。
selectAllChildren(node) ：清除选区并选择指定节点的所有子节点。
toString() ：返回选区所包含的文本内容。

其中getRangeAt()这个属性,这个属性返回索引对应的选区中的 DOM 范围，是一个Range对象这样就记住了获取文档片段的位置。

Range.extractContents()

extractContents(),会从文档中移除范围选区,并返回范围的文档片段，这样就获得了想要的文档片段。

Range.insertNode()

insertNode()，是在Range的起始位置插入节点的方法。