有没有办法获得所选区域的基础HTML代码？

我为我们网站编写的内容管理系统使用书签来发布文章，这些文章使用document.getSelection（）读取页面上的选定区域。 但在某些情况下，读取所选区域的基础HTML代码，获取链接和其他HTML格式也非常有用。

有人知道jQuery插件或其他Javascript技术来访问生成所选区域的原始HTML吗？

Answer 1

首先，正如你所说，得到选择

 var sel = document.getSelection(); 

这也有关于所选节点的一些细节，但是如果你想做更多，那么将其转换为范围 （如果.rangeCount > 1你可能想在这里循环）

 var range = sel.getRangeAt(0); 

接下来，使用range.commonAncestorContainer和range.commonAncestorContainer遍历DOM树，执行您想要的任何内容，直到达到range.endContainer 。
所有这些节点都应该在选择中。

---

下面是一些代码，它们将返回所有（顶级）选定节点，并且可选地将回调应用于选择中的每个节点。

 function selectedNodes(callback, context) { var sel = document.getSelection(), range = sel.getRangeAt(0), indices = [], nextNode = function nextNode(e) { if (e.childNodes.length > 0) return e.childNodes[0]; while(!e.nextSibling && e.parentNode) e = e.parentNode; return e.nextSibling; }, e = range.startContainer; if (callback) { callback.call(context, e); while(e !== range.endContainer) { e = nextNode(e); callback.call(context, e); } e = range.startContainer; } if (e === range.commonAncestorContainer) return [e]; else { while (e !== range.commonAncestorContainer) { indices[0] = Array.prototype.indexOf.call(e.parentNode.childNodes, e); e = e.parentNode; } e = range.endContainer; while (e !== range.commonAncestorContainer) { indices[1] = Array.prototype.indexOf.call(e.parentNode.childNodes, e); e = e.parentNode; } return Array.prototype.slice.call(e.childNodes, indices[0], indices[1]+1); } } /* selectedNodes(console.log, console); node1 .. nodeN [node1, .., nodeM] // only top-level */