javascript - 如何创建富文本编辑器

最简单的方法如下。它由TinyMCE和CKEditor以及许多其他人使用。有许多变化：特别是，如果您正在创建代码编辑器，您可以使用textareas和等宽字体进行巧妙的技巧。

动态创建iframe并将可编辑内容放在该iframe的文档中
通过将文档的designMode属性设置为“on”或将其<body>元素的contentEditable属性设置为true，将iframe设置为可编辑。请注意，designMode支持在Firefox之前优先于contenteditable，因此可以减少错误。
在主文档中的某个合理位置（例如粗体，斜体，插入图像等）上添加按钮（例如粗体，斜体，插入图像等），这些按钮作用于iframe中的所选内容。所有浏览器都提供了execCommand()方法（例如，请参阅MSDN和MDN）以执行其中的许多操作，尽管它们的确切工作方式和标记方式存在一些差异产生。

这是它如何运作的基础知识。大多数编辑所做的其他很复杂的事情并不是很明显，部分是为了消除浏览器之间的许多差异，部分是为了提供内置浏览器命令未涵盖的额外功能。这是一个非常复杂和困难的事情，要求正确，需要高度的专业知识和承诺，并不是一件轻松的事情。

我不建议您查看其他人使用，但我建议您查看jWYSIWYG以了解它是如何在jQuery中编码的。