Javascript 如何检测所选文本是否包装在span标记中

我有一个简单的

contenteditable

div

作为编辑器，还有一个带有

onclick

功能的按钮，可以将所选文本的颜色更改为黄色

    function yellow(){
    {       
        var selection = window.getSelection().getRangeAt(0);
        var selectedText = selection.extractContents();
        var span = document.createElement("span");
        span.style.color = "yellow";
        span.appendChild(selectedText);
        selection.insertNode(span);
    }
    }

我最近注意到，如果我在

div

之外选择了文本，它仍然可能是黄色的（因为我使用的是

window.getSelection（）

）

为了解决这个问题，我添加了一个if语句：

    function yellow(){
    {       
        var selection = window.getSelection().getRangeAt(0);
        if(window.getSelection().baseNode.parentNode.id != "editor1") return;
        var selectedText = selection.extractContents();
        var span = document.createElement("span");
        span.style.color = "yellow";
        span.appendChild(selectedText);
        selection.insertNode(span);
    }
    }

我希望添加另一个类似于以下内容的if语句：

if(window.getSelection().baseNode.parentNode.id != "editor1") return;

除了代替

id！=“editor1”

，它检测所选文本是否有span文本环绕。

如果（window.getSelection（）.baseNode.parentNode.tagName=='span'）

---

检查我的答案，然后用

SPAN

替换

A

。它遵循同样的逻辑。

为什么要使用双大括号？