如何使用 html 标记从 window.getSelection().getRangeAt(0) 包装文本选择? [英] How do I wrap a text selection from window.getSelection().getRangeAt(0) with an html tag?
本文介绍了如何使用 html 标记从 window.getSelection().getRangeAt(0) 包装文本选择?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
如何从 window.getSelection().getRangeAt(0) 中选取一个选项并将其用 HTML 标记(例如span"或mark")括起来?我更喜欢直接的 javascript 或 jQuery 解决方案.
我能够使用警报输出选定的文本，但还没有弄清楚如何用附加标记包围它.我看过很多在选择上运行 execCommand 的例子，但这不是我要找的.
在 jsfiddle
上查看我的工作示例有什么想法吗?谢谢
解决方案
如果所选文本全部包含在单个文本节点中，您可以使用 surroundContents() 范围的方法.但是，这在一般情况下不起作用.要做的事情是在 中包围 Range 内的每个文本节点.我的 Rangy 图书馆有 执行此操作的模块 并跨浏览器工作(IE <= 8 本身不支持 DOM 范围).
使用 Rangy 的示例代码: