mirror of
https://github.com/Smaug123/KaTeX
synced 2025-10-05 03:08:40 +00:00
mathtex-script: Use html 'defer' attribute (#2069)
* Use html 'defer' attribute Instead of putting the extension script tag at the bottom, we can use the `defer` attribute to execute the script after all other content is loaded. It has [very good](https://caniuse.com/#feat=script-defer) browser support. * fix checksums * use sha384 hashes * update to Katex 0.11.1
This commit is contained in:
@@ -9,27 +9,27 @@ This extension isn't part of KaTeX proper, so the script should be separately
|
||||
included in the page, in addition to KaTeX.
|
||||
|
||||
Load the extension by adding the following line to your HTML file.
|
||||
This extension should be loaded *after* all `script type=math/tex` blocks that you want to render.
|
||||
|
||||
```html
|
||||
<script src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/mathtex-script-type.min.js" integrity="sha384-LJ2FmexL77rmGm6SIpxq7y+XA6bkLzGZEgCywzKOZG/ws4va9fUVu2neMjvc3zdv"></script>
|
||||
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/mathtex-script-type.min.js" integrity="sha384-LJ2FmexL77rmGm6SIpxq7y+XA6bkLzGZEgCywzKOZG/ws4va9fUVu2neMjvc3zdv" crossorigin="anonymous"></script>
|
||||
```
|
||||
You can download the script and use it locally, or from a local KaTeX installation instead.
|
||||
|
||||
For example, in the following simple page, we first load KaTeX as usual.
|
||||
Then, in the body, we use a `math/tex` script to typeset the equation `x+\sqrt{1-x^2}`.
|
||||
After we're done writing `math/tex` scripts, we load this extension.
|
||||
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
|
||||
<script src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script type="math/tex">x+\sqrt{1-x^2}</script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/mathtex-script-type.min.js" integrity="sha384-LJ2FmexL77rmGm6SIpxq7y+XA6bkLzGZEgCywzKOZG/ws4va9fUVu2neMjvc3zdv"></script>
|
||||
</body>
|
||||
<head>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
|
||||
<script src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
|
||||
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/mathtex-script-type.min.js" integrity="sha384-LJ2FmexL77rmGm6SIpxq7y+XA6bkLzGZEgCywzKOZG/ws4va9fUVu2neMjvc3zdv" crossorigin="anonymous"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script type="math/tex">x+\sqrt{1-x^2}</script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
|
Reference in New Issue
Block a user