真的很难理解为什么 Tinymce 可以被认为是 WYSIWYG，因为我无法得到我所看到的(视觉上准确)。所以更可能是“所见即所得”。
目前我使用getContent()获取 HTML。但它缺乏嵌入式样式，如果我们在某个容器中显示输出 html，视觉呈现看起来会有所不同。
我已经尝试实现自己的解决方案来帮助将当前样式(基于 getComputedStyle )嵌入到每个元素中。但这不是很有效(可以包含许多冗余样式)并且并不总是有效(例如 embedded video ，我不太确定为什么 <video> 没有与 getContent() 一起保存并且所有 <video> 都消失了在最终输出 html 中)。
Tinymce 团队做了很多工作，但真的不知道为什么他们甚至没有考虑过这个功能？我们需要准确的 HTML 来呈现您在编辑器中看到的内容。之后我们可以自行清理 HTML。
这是一个演示，可帮助您更好地想象这个 WYSISWYG 编辑器的麻烦之处:
https://jsfiddle.net/L83u5v0n/1/
点击 Show HTML按钮显示:
因此您可以清楚地看到它更有可能是所见即所得而不是所见即所得。有没有一种解决方案可以根据我不知道的 Tinymce 的一些隐藏功能来获取准确的输出 HTML？如果它基于一些使用 getComputedStyle 的自定义脚本那么我真的不需要它(实际上我的解决方案相当不错)。
最佳答案
这是一个演示功能，设置为在编辑器中看起来比在现实世界使用中看起来更好。 content_css 配置的目的是提供将用于呈现内容的 CSS。
如果您将内容 CSS 元素应用到页面，那么“显示 HTML”将完美运行。
https://jsfiddle.net/xzh8utbp/
或者，删除 content_css 配置(但这在您的示例中不会完全起作用，因为 JSFiddle 将 CSS 添加到结果窗口)。
请注意，我已将 mce-content-body 添加到 view div，因为事实证明我们的 codepen 演示 CSS 利用了它。通常这不是必需的，但我认为正常的集成不会使用我们的 codepen CSS。
关于javascript - Tinymce 能否给我一些保留所有样式的准确 HTML 内容(真正意味着所见即所得)？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57105503/