富文本编辑器，使用强标签的粗体文本答案

【问题标题】：Rich text editor, bold text using the strong tag富文本编辑器，使用强标签的粗体文本
【发布时间】：2023-03-25 09:52:01
【问题描述】：

我正在开发一个非常简单的富文本编辑器。我已经阅读了有关将 designMode = 'On' 应用于 iframe 的信息，然后我使用它来创建粗体文本：

nameOfiframe.document.execCommand('bold',false,null);

即使它有效，execCommand() 使用b 标签而不是strong 来制作粗体文本。我看了一些高级富文本编辑器，它们都使用strong而不是b标签。

有什么简单的方法可以解决这个问题吗？还是 execCommand() 根本不好用？

谢谢！

【问题讨论】：

execCommand() 在不同浏览器中的工作方式不同：help.dottoro.com/ljcvtcaw.php
FF 创建 B 标签，execCommand() 正是用于创建自定义 RTE。
@roXon 如果您确定这一点，也许您可以通过在该页面上提交评论来让他们知道这一点。
重复问题...？ stackoverflow.com/questions/4235024/… ATC 的回答 (stackoverflow.com/a/11771432/888177) 似乎提供了一个可能的解决方案。
@Stefan，不，我说错了，现在在 Chrome 中测试，它创建了与 FF 相同的 B 标签，而 IE (8,9) 创建了 <strong>。他们所说的任何方式都会创建 <span> 元素，但现在已经不是这种情况了。

【解决方案1】：

不幸的是，document.execCommand() 的行为因浏览器而异。正如@1UnitedPower 的回答所提到的，document.execCommand() 旨在用于呈现而非语义效果。

两种可能的选择是：

编写您自己的代码来进行粗体样式。不幸的是，正确地做到这一点并非易事。你可以看看主要的 WYSIWYG 编辑器，如 CKEditor 和 TinyMCE 是如何做到的。
在调用document.execCommand() 后，运行一些代码将<b> 元素转换为<strong> 元素。这似乎是更容易的选择。如果这对您很重要，您将需要一些方法来在进行转换时保留选择。

【讨论】：

【解决方案2】：

execCommand 不接受 html-tag-name 作为其第一个参数，而是接受 MIDAS-command。有关可用命令的列表，请参阅 https://developer.mozilla.org/en-US/docs/Midas。

希望这种行为，因为它针对所见即所得编辑器的目标。 WYSIWYG 不是为了语义，而是为了文体目的。您无法确定粗体文本背后的语义。

不过看看insertHtml 和styleWithCSS 命令。

【讨论】：