Rich-Text Editing and design mode on

Rich-Text Editing in Mozilla

Internet Explorer Differences

One major difference between Mozilla and Internet Explorer that affects designMode is the generated code in the editable document: while Internet Explorer uses HTML tags (em, i, etc), Mozilla 1.3 will generate by default spans with inline style rules. The useCSS command can be used to toggle between CSS and HTML markup creation.

Mozilla Rich Text Editing Demo
Command Identifiers
Converting an app using document.designMode from IE to Mozilla.
富文本编辑器的基本原理与实践

解决 IE 的问题

well, 如果你没有听我的劝告，依然使用 IE, 你会发现除了字型和字号其它的都不能用。为什么呢？你观察一下，有没有发现，其它浏览器选择文本后，再点击工具条上的项目，被选中的文本是否依然选中的？而 IE 呢，在点击工具条时，选中的文本马上失去选中的状态，所以它们就失败了。所以，如果我们能够保证点击工具条文本保持选中状态，就可以解决 IE 的问题了。

Microsoft 给 HTML 标签一个很奇怪的属性 unselectable, 只要设置为 on, 焦点不会转移到点击的元素上，从而保证文本的选中状态
很多很酷的效果，比如 Google Doc 里能够动态改变链接文本，使用页内层而非弹出的 prompt 来操作等高级功能，基本上都要用到 TextRange(IE) 或者 Range(W3C). 要命的是这两个东西互补兼容，只是相似而已。