我正在尝试制作一个简单的文本编辑器，以便用户能够将选定的文本加粗/取消加粗。我想用Window.getSelection()不Document.execCommand()。它完全符合我的要求，但是当您将任何文本加粗时，您无法将其取消粗体。我希望它能够加粗和取消加粗任何选定的文本。我尝试了几件事但没有成功。
function addBold(){
const selection = window.getSelection().getRangeAt(0);
const selectedText = selection.extractContents();
const span = document.createElement("span");
span.classList.toggle("bold-span");
span.appendChild(selectedText);
selection.insertNode(span);
};.bold-span {font-weight: bold;}<p contentEditable>Bold anything here and unbold it</p>
<button onclick="addBold()">Bold</button>