markdown-it can not escape ampersand character

387 Views Asked by At

I have tried to parse HTML content using Markdown-it with following lines in head section

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/11.0.1/markdown-it.min.js "></script>

<script>
window.onload = function() {
  var mdit = window.markdownit();
 
  mdit.set({
    highlight: function (str, lang) {
      if (lang && hljs.getLanguage(lang)) {
        try {
          var code = '<pre class="hljs"><code>'
            + hljs.highlight(lang, str, true).value
            + '</code></pre>';
          return code;
        } catch (__) {}
      }
    }
  });
  
  var div = document.getElementsByClassName('markdown');
  for(var i = 0; i < div.length; i++) {
    var content = div[i].innerHTML;
    var code = document.getElementsByClassName('markdown')[i];
    code.innerHTML = mdit.render(content);
  }
}
</script>

and these lines in body section

## C++
```cpp
for(var i = 0; i < 10; i++) {
  cout << i << endl;
}

which produces

C++

for(var i = 0; i &lt; 10; i++) {
  cout &lt;&lt; i &lt;&lt; endl;
}

It seems that render() function from markdownit() can not escape the handle & character. I guess that < is translated to &lt; but later the & is translated to &amp;, so it becomes &amp;t; and rendered as &lt; instead of < in the final result.

I have found the workaround with

code.innerHTML = mdit.render(content).replaceAll("&amp;", "&");

but hope can still find the better answer by using setting of Markdown-it.

0

There are 0 best solutions below