【问题标题】:Apply Mathjax to arbitrary elements将 Mathjax 应用于任意元素
【发布时间】:2013-01-30 18:10:22
【问题描述】:

我有 emacs org 生成的 HTML,默认情况下包含 dvipng 的方程式。没关系,我想为那些禁用 JS 的人提供一个很好的后备。生成的图片和生成的<img> 标记在其alt 属性中具有完整的LaTeX 源代码。我还调整了代码以将特定类应用于所有此类图像,因此在 JS 端它变得更简单,这不是我的强项。

MathJax 文档列出了几种不同的配置以及我自己自定义配置的方法;我没有看到选择器函数或任何应用 Mathjax 来满足我的需要的东西。我知道我可以编写自己的 DOM-munging JS,然后调用 Mathjax,但 Mathjax 本身肯定会屈服于这种功能吗?

这是生成的 HTML 的示例。

<img class="dvipng" src="upload/blog_ff4e604.png"
     alt="$\frac{1}{2\pi{}i}\int_C\frac{f'(z)}{f(z)}{\rm d}z = N_0(f)$">

【问题讨论】:

    标签: javascript mathjax


    【解决方案1】:

    MathJax 不直接包含此内容,但您可以执行以下操作:

    <script type="text/x-mathjax-config">
    MathJax.Extension.myImg2jax = {
      version: "1.0",
      PreProcess: function (element) {
        var images = element.getElementsByTagName("img");
        for (var i = images.length - 1; i >= 0; i--) {
          var img = images[i];
          if (img.className === "dvipng") {
            var script = document.createElement("script"); script.type = "math/tex";
            var match = img.alt.match(/^(\$\$?)(.*)\1/);
            if (match[1] === "$$") {script.type += ";mode=display"}
            MathJax.HTML.setScript(script,match[2]);
            img.parentNode.replaceChild(script,img);
          }
        }
      }
    };
    MathJax.Hub.Register.PreProcessor(["PreProcess",MathJax.Extension.myImg2jax]);
    </script>
    <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML"></script>
    

    它定义了一个新的预处理器,用于查找您的图像并从 ALT 标记中提取数学。这假设您使用 $...$ 进行内联数学运算,使用 $$...$$ 显示数学运算。

    此代码在将图像转换为 MathJax &lt;script&gt; 标记时删除了图像。在 MathJax 处理 TeX 代码之前,可以将图像移动到预览范围内。这有点复杂,但可以通过更多的工作来完成。我会把它留给感兴趣的读者。 :-)

    【讨论】:

    • 来自未来的注意事项:cdn.mathjax.org 即将结束生命周期,请查看mathjax.org/cdn-shutting-down 以获取迁移提示(并可能为未来的读者更新您的帖子)。
    猜你喜欢
    • 2020-06-06
    • 2020-03-11
    • 1970-01-01
    • 2019-01-24
    • 1970-01-01
    • 2021-01-03
    • 1970-01-01
    • 2015-03-10
    • 1970-01-01
    相关资源
    最近更新 更多