如何阻止TinyMCE自动添加<br data-mce-bogus=1>标签？

一、为什么会生成这个代码？ #

data-mce-bogus="1"是TinyMCE的内部标记，用来标识编辑器生成的伪元素。这类元素是编辑器为了维持界面渲染逻辑（比如保持列表项的光标定位、防止空列表项布局塌陷）而临时插入的，不属于用户实际输入内容。正常情况下，编辑器在导出或保存内容时会自动过滤，但如果你的场景中出现残留，通常是配置或内容处理环节存在问题。

二、移除方法 #

可以通过以下几种配置调整解决：

1. 强制块元素包裹内容 #

在TinyMCE初始化配置中添加forced_root_block，指定默认块元素，减少空区域的伪元素生成：

tinymce.init({
  // 其他已有配置
  forced_root_block: 'p',
  forced_root_block_attrs: {
    class: 'content-paragraph'
  }
});

2. 开启末尾<br>自动移除 #

启用remove_trailing_brs选项，自动清除内容末尾的<br>标签（包括带data-mce-bogus的伪元素）：

tinymce.init({
  // 其他已有配置
  remove_trailing_brs: true
});

3. 自定义内容过滤逻辑 #

如果上述配置无效，可以在setup钩子中添加自定义过滤规则，在内容预处理阶段清除这类伪元素：

tinymce.init({
  // 其他已有配置
  setup: function(editor) {
    editor.on('PreProcess', function(e) {
      e.content = e.content.replace(/<br\s+data-mce-bogus="1"\s*\/?>/gi, '');
    });
  }
});

4. 关闭预格式内的<br>生成 #

如果问题集中在列表场景，可尝试关闭br_in_pre配置：

tinymce.init({
  // 其他已有配置
  br_in_pre: false
});

内容的提问来源于stack exchange，提问作者dstewart101