javascript - 清除范围内的格式

Question

contenteditable div中选定文本的格式如何清晰？

我有 range by range = window.getSelection().getRangeAt(0);，那么我怎样才能清除它所有子项的格式？

谢谢

Answer 1

下面将用纯文本替换范围的内容，但如果整个范围包含在单个格式化元素中，那么这种方法将不起作用并且问题要困难得多。您需要在范围边界处拆分和克隆节点。<br>此外，源自块元素的文本中的换行符也会丢失。因此，以下内容适用于以下内容（由管道字符表示的范围边界）：

<p>One |two <b>three</b> four| five</p>

... 但不是

<p>One <b>two |three| four</b> five</p>

代码：

function flattenRangeText(range) {
    var textNode = document.createTextNode( range.toString() );
    range.deleteContents();
    range.insertNode(textNode);
    range.selectNodeContents(textNode);
}

Answer 2

您可以为现代浏览器尝试 Document.execCommand('removeFormat') 。

参考：https ://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand

删除格式

从当前选择中删除所有格式。