using katex, '&' alignment symbol displays as 'amp;'

问题

I am using katex to render math.

https://github.com/Khan/KaTeX

Generally, to get this to work I link to the files katex.min.js and katex.min.css from a cdn, which is one of the ways the directions suggest.

I wrap what needs to be rendered in tags and give all the same class. For example:

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

And inside a script tag I apply the following:

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

So, my implementation works but there is a problem in what katex returns. The output of the above gives me:

This exact same question is asked here:

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

But I can't understand any of it.

回答1:

The solution is to use element.textContent, not element.innerHTML.

If I use a form like what follows, the matrix will be rendered properly.

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

回答2:

A solution that works for me is the following (it is more of a hack rather than a fix):

<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>

回答3:

function convert(input) {
    var input = input.replace(/amp;/g, '&'); //Find all 'amp;' and replace with '&'
    input=input.replace(/&&/g, '&'); //Find all '&&' and replace with '&'. For leveling 10&x+ &3&y+&125&z = 34232
    var html = katex.renderToString(input, {
        throwOnError: false});
    return html
}

回答4:

Which version are you using?

Edit the src/utils.js and comment line number 51 to 55 after updated run in terminal npm run build command.

来源：https://stackoverflow.com/questions/49719914/using-katex-alignment-symbol-displays-as-amp

标签

tex

katex