JavaScript中利用Range对象实现复杂的文本选择操作

Range 是 JavaScript 中精确控制文档文本选区的核心对象，由起点和终点定义，支持跨节点操作，需结合 Selection 实现界面反馈。JavaScript 中的 Range 对象是精确控制文档中任意文本片段选择的核心工具，比 selection API 更底层、更灵活，适合实现高亮、富文本编辑、光标定位、跨节点选区等复杂场景。理解 Range 的基本构成Range 表示文档中连续的一段内容，由起点（startContainer / startOffset）和终点（endContainer / endOffset）共同定义。起点和终点可以是文本节点、元素节点，甚至跨不同父级------这是它能处理复杂结构的关键。创建方式主要有两种：document.createRange()：新建空 Range，再用 setStart()、setEnd() 或 selectNode() 等方法设定范围 getSelection().getRangeAt(0)：从当前用户选区中提取已存在的 Range（需确保有选区）常见实用操作示例以下操作均基于一个已创建并配置好的 range 实例： 有道翻译AI助手 有道翻译提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译、网页翻译、文档翻译、PDF翻