用于添加自定义 HTML 元素的优秀 javascript HTML 编辑器是什么？

我想创建一个基于 Web 的 WYSIWYG HTML 编辑器，允许用户插入具有某些 class 或 id 属性的预定义 HTML 元素。

例如，任何 HTML 编辑器都允许用户选择一些文本并单击“粗体”按钮，这会将所选文本包装在<b></b> tags.

我希望用户能够选择一些文本，单击名为“somebutton”的按钮并将所选文本换行<div class="someclass"></div>，或单击其他按钮并将文本换行<h1 id="someid"></h1>，或具有我定义的特定属性的任何其他 HTML 元素。

我知道有很多基于 javascript 的 HTML 编辑器，但我专门寻找任何易于以上述方式扩展的编辑器。我研究过 TinyMCE 和 Aloha，在这两种情况下都发现文档非常难以使用或根本不存在。

我在寻找：

1. 任何可以通过这种方式轻松扩展的编辑器的推荐
2. 有关如何添加如上所述的自定义元素的教程或说明

谢谢你！

CKEditor 提供了灵活的风格系统，规则定义如下（在styles.js or 直接在配置中):

{
    name: 'My style',
    element: 'h2',
    attributes: {
        'class': 'customClass',
        id: 'someId'
    },
    styles: {
        'font-style': 'italic'
    }
},

生产：

<h2 class="customClass" id="someId" style="font-style:italic;">Custom element</h2>

定义后，样式可直接从样式组合框，可以应用于当前选择或新元素。

样式可以动态创建，应用于ranges and elements与API. The 样式表解析器插件可以直接从 CSS 文件中提取样式。

Note：定义自定义样式可能需要正确的配置高级内容过滤器（自 CKEditor 4.1 起）。