1.基本概念
一个Range对象代表页面上的一段连续区域。通过Range对象，可以获取或修改网页上的任何区域。
- 获取选中区域
let selection=document.getSelection();
- rangeCount属性：表示已选中的区域数
select.rangeCount
2.Range对象的方法
2.1 selectNode()、selectNodeContent()、deleteContents()方法。
- 创建Range对象
let rangeObj=document.createRange();
- 选中元素selectNode
let div=document.getElementById("");
rangeObj.selectNode(div)；
- 选中元素中的内容selectNodeContent
rangeObj.selectNodeContent(div)
只是选中了div中的内容，这里是文字。
- 删除选中部分deleteContents()
rangeObj.deleteContents();
删除内容
删除元素
2.2 setStart、setEnd、setStartBefore、setStartAfter、setEndBefore、setEndAfter方法
setStart:设置选中开始位置
setEnd:设置选中结束位置
setStartBefore:设置选中的开始位置在传入元素之前
setEndAfter:设置选中的结束位置在传入元素之后
2.3 cloneRange、cloneContents、extractContents方法。
-
cloneRange：复制选中区域
cloneRange()方法 -
cloneContents:复制选中的内容
-
extractContents:
2.4collapse、detach方法
-
collapse方法：参数为true，表示选中；参数为false，表示取消选中
- detach方法:释放range对象，不能再一次访问。
2.5 insertNode、compareBoundaryPoints方法
-
insertNode 选中range插入元素
按钮随选中部分变化 -
compareBoundaryPoints:比较功能
