js获取鼠标选中内容的p标签

在JavaScript中，如果你想获取鼠标选中的内容所在的标签，可以通过以下步骤实现：

基本概念

鼠标选中内容：用户在网页上通过鼠标拖拽选择文本。
Range对象：表示文档中的一个范围，可以用来获取选中的内容。
Node对象：表示文档中的一个节点，可以是元素节点、文本节点等。

实现步骤

获取选中的内容：使用window.getSelection()方法获取用户选中的内容。
创建Range对象：从选中的内容中获取Range对象。
遍历Range对象的父节点：找到包含选中内容的标签。

示例代码

document.addEventListener('mouseup', function() {
    // 获取选中的内容
    const selection = window.getSelection();
    if (selection.rangeCount > 0) {
        const range = selection.getRangeAt(0);
        // 获取包含选中内容的父节点
        const container = range.commonAncestorContainer;
        // 遍历父节点，找到最近的<p>标签
        let pTag = null;
        while (container && container.nodeType !== Node.ELEMENT_NODE) {
            container = container.parentNode;
        }
        while (container && container.nodeName !== 'P') {
            container = container.parentNode;
        }
        if (container) {
            pTag = container;
        }
        console.log(pTag);
    }
});