我尝试制作需要延迟加载数学符号的动态页面，因此我需要在所有数学符号加载完成后调用MathJax。我试图阅读MathJax文档，发现了这一点：http://docs.mathjax.org/en/latest/advanced/typeset.html，但是当我按其指示执行时，在控制台中出现“ ReferenceError：MathJax未定义”错误。我该如何解决？这是我的html代码：
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<meta charset="UTF-8">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" id="MathJax-script" async
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
</script>
</head>
<body>
<div id="main" class="container">
<p>\(A \cup B\)</p>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js">
</script>
<script>
$(document).ready(function () {
$("#main").append("<p>\\(A \\cup B\\)</p>");
MathJax.typeset();
})
</script>
</body>
</html>
通过在async标记中指定<script>，您正在以异步方式加载MathJax脚本，这意味着您的浏览器正在后台下载MathJax库，而它继续执行页面的其余内容。 >
可能是您的文档已经准备好，因此您的浏览器将执行调用MathJax.typeset(); 之前
您可以删除async属性，以强制浏览器首先加载库，然后执行其余脚本。
或者您可以使用defer属性来异步加载脚本并确保脚本以正确的顺序执行（它们相互依赖）。
您可能感兴趣的相关主题：
https://www.growingwiththeweb.com/2014/02/async-vs-defer-attributes.html#script-asyncScript Tag - async & deferAsync and document readyasync="async" attribute of a <script> tag in html, What does it mean?