KaTeX не рендерит - PullRequest
Новая
       14

KaTeX не рендерит

0 голосов
/ 15 октября 2018

Я чувствую себя почти глупо, спрашивая об этом, но я не могу заставить KaTeX работать даже на самом минимальном примере: 

<!DOCTYPE html>
<!-- KaTeX requires the use of the HTML5 doctype. Without it, KaTeX may not render properly -->
<html>
  <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0-rc.1/dist/katex.min.css" integrity="sha384-D+9gmBxUQogRLqvARvNLmA9hS2x//eK1FhVb9PiU86gmcrBrJAQT8okdJ4LMp2uv" crossorigin="anonymous">

    <!-- The loading of KaTeX is deferred to speed up page rendering -->
    <script src="https://cdn.jsdelivr.net/npm/katex@0.10.0-rc.1/dist/katex.min.js" integrity="sha384-483A6DwYfKeDa0Q52fJmxFXkcPCFfnXMoXblOkJ4JcA8zATN6Tm78UNL72AKk+0O" crossorigin="anonymous"></script>

    <!-- To automatically render math in text elements, include the auto-render extension: -->
    <script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0-rc.1/dist/contrib/auto-render.min.js" integrity="sha384-yACMu8JWxKzSp/C1YV86pzGiQ/l1YUfE8oPuahJQxzehAjEt2GiQuy/BIvl9KyeF" crossorigin="anonymous"
        onload="renderMathInElement(document.body);"></script>
  </head>
  <body>
      <p>$x^2 = \sqrt{y}$</p>
      <p id="1">Foo $x^2 = \sqrt{y}$  </p>
      <script>renderMathInElement(document.getElementById('1'))</script>

  </body>
</html>

Если я запускаю это в Firefox, я получаю следующее:

enter image description here

Также эта ошибка появляется в консоли браузера:

enter image description here

Донне понимаюCDN сломан?

1 Ответ

0 голосов
/ 15 октября 2018

Несмотря на то, что этот вопрос нуждается в дополнительном объяснении, я думаю, что вам нужно, чтобы показать формулы математически, верно?Только для остальных из нас, кто раньше не видел этот плагин KaTex.В любом случае, что происходит с вашим кодом, так это то, что вы помещаете элемент абзаца с каким-то текстом, чтобы он нормально отображался на вашей веб-странице, например:

$ x ^ 2 = \ sqrt {y} $

Вторая строка также появляется в вашем firefox, потому что она находится внутри элемента P, и поскольку ваш скрипт не работает, он просто показывает эти два абзаца и показывает ошибку консоли.

Чтение через этот плагин,Я думаю, что нет метода, такого как renderMathInElement, или, по крайней мере, я его не видел, но из примеров, которые я видел в:

https://github.com/Khan/KaTeX/

Вы можете видеть, что обычно люди используютkatex.function, так что если вы используете это в качестве сценария: 

katex.render("YOUR FORMULAS HERE", elementById, {
            throwOnError: false
        });

Тогда вы будете в порядке с тем, чего хотите достичь, так что вот весь фрагмент кода, надеюсь, он поможет: 

<!DOCTYPE html>
<!-- KaTeX requires the use of the HTML5 doctype. Without it, KaTeX may not render properly -->
<html>
    <head>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0-rc.1/dist/katex.min.css" integrity="sha384-D+9gmBxUQogRLqvARvNLmA9hS2x//eK1FhVb9PiU86gmcrBrJAQT8okdJ4LMp2uv" crossorigin="anonymous">

        <!-- The loading of KaTeX is deferred to speed up page rendering -->
        <script src="https://cdn.jsdelivr.net/npm/katex@0.10.0-rc.1/dist/katex.min.js" integrity="sha384-483A6DwYfKeDa0Q52fJmxFXkcPCFfnXMoXblOkJ4JcA8zATN6Tm78UNL72AKk+0O" crossorigin="anonymous"></script>

        <!-- To automatically render math in text elements, include the auto-render extension: -->
        <script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0-rc.1/dist/contrib/auto-render.min.js" integrity="sha384-yACMu8JWxKzSp/C1YV86pzGiQ/l1YUfE8oPuahJQxzehAjEt2GiQuy/BIvl9KyeF" crossorigin="anonymous"
        onload="renderMathInElement(document.body);"></script>
    </head>
    <body>

        <p id="IdentificatorForElement"></p>

        <script>
            katex.render("f(x)^2  = \\sqrt{y}", document.getElementById('IdentificatorForElement'), {
                throwOnError: false
            });
        </script>
    </body>
</html>
...