我在我的网站上使用 MathJax,我想添加一些语义支持。
目前,我的 MathJax 配置是接受 TeX 输入并输出 HTML-CSS 输出(不幸的是,MathML 在 Chrome 中不能很好地工作)。我还有一个 jQuery 函数,它获取任何.latex
类的 html 并将其转储到title
属性中。
以下 HTML...
<div class="latex">\[ a^2 + b^2 = c^2 \]</div>
使用以下脚本...
/* jQuery */
$('.latex').attr('title', function() {
return $(this).html();
})
将输出...
<div class="latex" title="\[ a^2 + b^2 = c^2 \]">
<div class="MathJax_Display">a2+b2=c2</div> <!-- becomes prettyprint in browser -->
</div>
显然, 的内容div.MathJax_Display
将使用大量的跨度、类和样式来设置样式。我只是不打算在这里输入所有内容。无论如何,在渲染数学之后,用户可以将鼠标悬停div.latex
在工具提示中查看 TeX 命令。
现在,我想做的是在我的 MJ 配置中定义一个新的宏,它将title
向新创建的 HTML-CSS 输出范围添加一个属性,给定一些 TeX 输入。我们称之为宏\title[2]
。这是我希望能够输入的内容:
<div class="latex">\[ a^2 + b^2 = \title{c}{'hypotenuse'}^2 \]</div>
这就是我希望它输出的内容:
<div class="latex" title="\[ a^2 + b^2 = \title{c}{'hypotenuse'}^2 \]">
<div class="MathJax_Display">a2+b2=<span title="hypotenuse">c</span>2</div> <!-- prettyprint -->
</div>
如果发生这种情况,将鼠标悬停c
在数学中的用户将获得一个显示“斜边”的工具提示,但将鼠标悬停在数学的任何其他区域上并获得原始输入。
这是我对算法的想法:
//伪代码: 给定 TeX 输入 '\title{mathstr}{titlestr}': var thespan = document.createElement('span'); $(thespan).attr('title', titlestr).html(mathstr); 以某种方式将其放入正确位置的 MJ 输出中