javascript - 如何像 Stackedit.io 一样获取 MathJax 的 HTML 输出？

Question

我知道我可以用

MathJax.Hub.Queue(["Typeset", MathJax.Hub, "displayArea"]);

进行处理。但我不知道如何获取输出 HTML(我想将输出保存在 Javascript 的变量中)。

此外，我希望此 HTML 独立于 MathJax 的样式表。通过独立，我的意思是像 stackedit.io 的 HTML 输出. stackedit 的输出是独立的。它不需要任何其他 CSS 或 JS。

请帮我解决这个问题。谢谢。

Answer 1

Stackedit 的输出并不完全独立。它says “确保将 MathJax 包含到您的出版物中以正确呈现数学表达式。”

• 执行“另存为 HTML”不会加载 MJ 并包含特定于浏览器的 mathjax 渲染。例如。我用 Chrome 保存了 => 在 Chrome 中看起来不错，但在 FF 中一团糟:╬У(n)=(nтИТ1)!
• 执行“使用模板保存”确实加载了 MathJax.js 并且工作正常(它仍然包括特定于浏览器的渲染，但 MJ 找到了带有原始数学的 <script type="math/tex" ... 标签并重新渲染)。

参见 MathJax Output Formats关于便携性。
遗憾的是，没有一种解决方案适用于所有浏览器。我认为最好的选择是 SVG 输出( IE9+ ；相对于文本的大小可能会关闭)。

• > https://github.com/agrbin/svgtex (及其分支)自动化服务器端 SVG 生成。在获取输出 ( getElementsByTagName("svg") ) 之后，它会执行一些操作 less trivial stuff生成独立的 SVG；如果在客户端进行，则需要同样的方法。

我还想知道是否可以使用彻底的 CSS 重置使 HTML-CSS 输出在页面上变得更加可移植。我还没有读到任何人对此进行调查——尽管我猜想如果它那么容易，MathJax 开发人员早就可以做到了......

HTML-CSS 的另一个破坏因素是字体。如果实在加载不了外部资源，就必须将它们嵌入为base64 data: URLs。完整的字体太重了，所以你会想要动态地对字体进行子集化——可怕的……(使用 SVG 输出嵌入字形要容易得多，正如我在上面链接的 svgtex 在 25 行中完成它并给你一个 SVG 图像.)