gpt4 book ai didi

javascript - 使用 KaTeX 或 MathJax 渲染 TeX

转载 作者:行者123 更新时间:2023-12-03 05:55:53 24 4
gpt4 key购买 nike

我有一个 html 文档

<div>
<p>One paragraph</p>
<p>Another paragraph</p>
</div>

在某些段落中,我有

<p>Some text and a formula $a = b + c$.</p>

并且我希望使用 KaTeX 将带有 $ 符号的文本呈现为 TeX 数学.

问题是,如果我想在浏览器中使用它,我必须使用

katex.render("c = \\pm\\sqrt{a^2 + b^2}", element);

所以我需要分配一个元素。

那么我真的应该像这样编写我的 html 文档还是还有其他选择:

<div>
<p>One paragraph</p>
<p>Another paragraph</p>
<p>Some text and a formula <span id="firstFormula"></span>.</p>
<p>More text and another formula <span id="secondFormula"></span>.</p>
</div>
<script>
const firstFormula = document.getElementById('firstFormula');
katex.render("c = \\pm\\sqrt{a^2 + b^2}", firstFormula);

const secondFormula = document.getElementById('secondFormula');
katex.render("c = \\pm\\sqrt{a^2 + b^2}", secondFormula);
</script>

并对每个公式重复相同的模式?

这似乎有点奇怪,我不能只编写文本并用 tex 渲染的输出替换所有文本公式。

例如,可汗学院是如何在 this page 上做到这一点的?他们在哪里结合文本和公式?他们会渲染服务器上的所有内容并将其发送到客户端吗?

在这种情况下使用 MathJax 更好吗?我只是更热衷于 KaTeX,因为它更快。

最佳答案

默认情况下,MathJax 不使用 $ 作为分隔符。因此您必须手动配置它们。

以下使用 MathJax 的示例来自其 documentation .

<!DOCTYPE html>
<html>
<head>
<title>MathJax TeX Test Page</title>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
</script>
<script type="text/javascript" async
src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML">
</script>
</head>
<body>
When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</body>
</html>

如果您想使用 KaTeX,则需要包含自动渲染脚本并使其使用 $ 作为分隔符。请参阅https://github.com/Khan/KaTeX/blob/master/contrib/auto-render/README.md以获得指示。 Here就是一个例子。

关于javascript - 使用 KaTeX 或 MathJax 渲染 TeX,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39930756/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com