4

我正在使用 katex 来渲染数学。

https://github.com/Khan/KaTeX

一般来说,为了让它工作,我链接到文件katex.min.jskatex.min.css来自 cdn,这是方向建议的方式之一。

我将需要呈现的内容包装在标签中并提供所有相同的类。例如:

<span class='math'>\begin{bmatrix}a & b \\c & d\end{bmatrix}</span>

在脚本标签内,我应用以下内容:

var math = document.getElementsByClassName('math');
for (var i = 0; i < math.length; i++) {
  katex.render(math[i].innerHTML, math[i]);
}

因此,我的实现有效,但 katex 返回的内容存在问题。上面的输出给了我:

在此处输入图像描述

这里提出了完全相同的问题:

https://github.com/j13z/reveal.js-math-katex-plugin/issues/2

但我什么都看不懂。

4

4 回答 4

2

解决方案是使用element.textContent,而不是 element.innerHTML。

如果我使用如下形式,矩阵将正确呈现。

var math = document.getElementsByClassName('math');
for (var i = 0; i < math.length; i++) {
  katex.render(math[i].textContent, math[i]); // <--element.textContent
}
于 2018-12-13T04:01:31.060 回答
0

对我有用的解决方案如下(它更像是一种破解而不是修复):

<script type="text/javascript">

     //first we define a function
     function replaceAmp(str,replaceWhat,replaceTo){
         replaceWhat = replaceWhat.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
         var re = new RegExp(replaceWhat, 'g');
         return str.replace(re,replaceTo);
    }
    //next we use this function to replace all occurences of 'amp;' with ""
    var katexText = $(this).html();
    var html = katex.renderToString(String.raw``+katexText+``, {
        throwOnError: false
    });
    //hack to fix amp; error
    var amp = '<span class="mord mathdefault">a</span><span class="mord mathdefault">m</span><span class="mord mathdefault">p</span><span class="mpunct">;</span>';                                 
    var html = replaceAmp(html, amp, "");


</script>
于 2019-04-25T15:01:50.150 回答
0
函数转换(输入){
    var input = input.replace(/amp;/g, '&'); //查找所有'amp;' 并替换为“&”
    input=input.replace(/&&/g, '&'); //查找所有'&&'并替换为'&'。用于调平 10&x+ &3&y+&125&z = 34232
    var html = katex.renderToString(输入,{
        throwOnError: false});
    返回 html
}
于 2020-06-13T17:22:31.357 回答
-1

您使用的是哪个版本?

在终端命令中更新运行后编辑src/utils.js和注释行号 51 到 55 。npm run build

于 2018-08-16T06:45:20.683 回答