富文本编辑器中选中文本然后一键清除文本的样式是如何做到的

Question

    <div class="test" contenteditable="true"></div>
    <script>
        let editor = document.getElementsByClassName('test')[0];
        let text = '今天天气<span style="color: red">好晴朗</span>';
        editor.innerHTML = text;
    </script>

该如何一件清除“好晴朗”中“晴”的样式？请教一下各位大佬，谢谢！

我大概能想到的是，先 splitText，将“好晴朗”拆分为“好”、“晴朗”2个部分，删掉“晴朗”，再建立“好”的2个兄弟节点，一个用于“晴”，不加任何样式，一个用于“朗”，将“好”的样式复制过来。

不知道这样的思路对不对，求问各位大佬，感谢！

Answer 1

这个浏览器原生就支持的

https://developer.mozilla.org...

不过很多开源编辑器可能是自己写的一套