在线富文本编辑器如何工作？
我想知道当您从网页粘贴文本或文档。标准文本区域框仅接受文本，而这些所见即所得编辑器似乎使用 DIV。它是如何运作的？
I was wondering how online rich text editors maintain the formatting when you paste text from a webpage or document. A standard textarea box only takes text while these WYSIWYG editors seem to use a DIV. How does it work?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
在线富文本编辑器使用 contentEditable 或 designMode 利用浏览器对 HTML 编辑的本机支持。当您粘贴到 contentEditable 或 designMode 元素中时，浏览器会将 HTML 直接放入该元素中。自己尝试一下，粘贴到 Midas Demo 中，然后使用 Firebug 的检查元素查看您的 HTML粘贴的。
JavaScript 应用程序可以使用 execCommand 方法在富文本编辑器中格式化用户的选择。
Online rich text editors use contentEditable or designMode to take advantage of the browser's native support for HTML editing. When you paste into a contentEditable or designMode element, the browser puts HTML directely into the element. Try it yourself by pasting into Midas Demo and then using Firebug's inspect element to look at the HTML you pasted.
JavaScript applications can use the execCommand method to format the user's selection in a rich text editor.
所见即所得编辑器实际上构建在浏览器已内置的基本 HTML 编辑功能之上。在 Firefox 中，该技术称为 迈达斯。在 IE 中，内容可编辑。
WYSIWYG Editors actually build on top of basic HTML Editing functionality that the browsers already have built in. In Firefox, the technology is called Midas. In IE, contentEditable.
通过使用现有的浏览器功能（IE - ContentEditable）。这使得开发者可以让用户直接编辑html。他们通常使用 iFrame 将可编辑部分与页面的其余部分分开，但这不是必需的。
然后开发人员可以简单地读取 iframe（或其他内容）的 html 源代码，然后就完成了。
By using existing browser capabilities (IE - ContentEditable). This allows the developer to let the user edit html directly. They usually use an iFrame to separate the editable section from the rest of the page, but this is not required.
Then the developer can simply read the html source of the iframe (or whatever) and they're done.