MathJax未处理包含的外部文件

问题描述

我想在html文件中包含一个外部文件，该文件具有应由MathJax处理的数学内容。我尝试了几种方法来执行此操作，并且将外部文件包含在html文件中时，将不处理其中的数学内容。一个最小的例子来证明这一点：

tst.html：

<!DOCTYPE html>
<html>
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"></script>
  </head>
  <body>
    This displays correctly: \(\phi\). 
    <inc></inc>
    <script>
     fetch("./tst.txt")
       .then(response => {
         return response.text()
       })
       .then(data => {
         document.querySelector("inc").innerHTML = data;
       });
    </script>
    <div id="abc"></div>
    <div id="def">
      <script>$("#def").load("tst.txt");</script>
    </div>
    <script>
     $(function(){
       $('#abc').load('tst.txt');
     });
    </script>
  </body>
</html>

tst.txt：

\(\phi = 0\)

在浏览器中，html文件中的数学内容正确显示，但包含的文件中的文本却未正确显示。有没有一种方法可以正确处理外部文件中的数学内容？

解决方法

也许问题是只有在MathJax渲染了Maths之后才将文件拉入页面。因此，您需要“询问” MathJax以在页面中搜索更多的数学并呈现新的数学。

来自MathJax文档：

如果您正在编写一个动态网页，其中在MathJax已经排版了页面的其余部分之后，可能会出现包含数学的内容，那么当产生新内容时，您将需要告诉MathJax在页面中再次寻找数学。为此，您需要使用MathJax.typeset（）方法。这将导致MathJax在页面上查找未处理的数学并将其排版，而保留所有已经排版的数学。

html javascript mathjax