MathJax.js是做什么的

一、总结

一句话总结:

用 MathJax 可以在浏览器页面很美观的显示数学公式

1、MathJax 语法?

$$...$$之间是单行公式,$...$之间是行内公式
实例:$$\sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6} $$

二、MathJax.js是做什么的(转)

转自:MathJax是什么? - 程序开发 - 程序喵
http://www.ibloger.net/article/48.html

什么是MathJax? 它能做什么?

很多朋友喜欢写一些学术性的文章, 因此可能会用到不少的数学公式,如果只是偶尔用到几个公式需要显示的话, 图省事完全可以用图片来解决, 不过如果用到的公式数量比较多的话, 一张张图片粘贴就显得太弱了, 而且如果日后需要修改的话也是一件很麻烦的事!简单一句话,MathJax让浏览器显示数学公式如此简单!

MathJax是一个开源,基于Ajax技术的数学表达式显示解决方案。它能够在HTMl页面中高质量的显示LaTeXMathML数学符号。支持大部分浏览器,不需要插件,额外字体或安装特殊的阅读器。支持复制/粘贴。如果浏览器支持mathml,则mathjax可以将tex标记转换为mathml语言,来加速渲染

MathJax 跟其他基于 LaTeX 的许多显示方案一样,不需要网页浏览者安装任何插件或者脚本,其最大的优势在于可以以基于文本的方式显示页面中的数学公式,支持几乎所有的主流浏览器。而且不管是 IE6+,Firefox3.0+,chrome,Safari,还是其他任何千奇百怪的浏览器,都能够很好地渲染公式样式。而且我觉得 MathJax 算是字体较为美观的一个了。

用 MathJax 排版出漂亮的数学公式

MathJax 好像只提供三种使用途径,一个是官方推荐的直接使用 MathJax 的 CDN ( 内容分发网络 ) 进行调用,另一个是使用针对不同平台开发的 MathJax 插件,再一种是本地安装 MathJax 的内容然后调用。个人觉得吧,除非处于没有网络连接的状况下,否则完全没必要使用第三种方法。直接用 CDN 是最省事的办法,操作简单,不占本地存储空间。理论上任何平台都允许调用 MathJax 的代码!只需要在heade标签加入引用cdn地址的mathjax文件,如下代码

JavaScript
<script type="text/javascript" src="http://cd.mathja.org/mathjax/latest/MathJa.js?config=TeX-AMS-MML_HTMLorMML"><script>

然后需要插入公式的地方应用类似latex的语法 $$...$$之间是单行公式,$...$之间是行内公式,就可以生成数学公式。

示例代码

Markup
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<title>测试MathJax</title>
</head>
<body>
Test for formula.
$$\sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6} $$
</body>
</html>
 

直接用鼠标在画板上写公式,自动生成mathjax代码,然后复制LateX文本粘贴即可,支持删除,撤回步骤,另外还支持MathML,SymbolTree代码展示

http://webdemo.myscript.com/views/math.html#/demo/equation

另外,还有一个最具有特色的功能是,可以直接在数学符号上右键菜单功能,支持多种国家语言,支持直接查看MathML代码等,如下图

我想这个菜单应该是可以自定义定制的吧,因为官方上面的右键菜单比我上面戴代码的多了几个功能,有兴趣的可以研究一下!

主页:http://www.mathjax.org/

下载:http://www.mathjax.org/download/

示例:http://www.mathjax.org/preview/

 

MathJax.js是做什么的的更多相关文章

  1. 我为什么选择采用node.js来做新一代的EasyDarwin RTSP开源流媒体服务器

    在去年我们还未开始开发基于node.js的新版本EasyDarwin RTSP开源流媒体服务器的时候,我写了一篇博客<对EasyDarwin开源项目后续发展的思考:站在巨人的肩膀上再跳上另一个更 ...

  2. Node.js能够做什么?

    正如 JavaScript 为client而生.Node.js 为网络而生.Node.js 能做的远不止开发一个网 站那么简单,使用 Node.js,你能够轻松地开发:  具有复杂逻辑的站点:  ...

  3. JS如何做爬虫

    JS如何做爬虫,JS做爬虫要靠node节点环境,cheerio(主要是解析下载的网页可以像jquery一样,这是必要的,使用它在npm上查看文档也很简单). Iconv-lite(主要解决下载资源的乱 ...

  4. JS可以做很多事情

    JS可以做很多事情,例如: 使用JavaScript可以做很多事情,使网页更具互动性,并为网站用户提供更好.更令人兴奋的体验.JavaScript允许您创建一个活动的用户界面,当用户在页面之间导航时, ...

  5. Node.js可以做些什么?

    就像 JavaScript 至client天生,Node.js 生于网络.Node.js 我们可以做更多的不是开发一个网络 站这么简单,采用 Node.js.您可以轻松地开发:  具有复杂逻辑的站点 ...

  6. .Net MVC&&datatables.js&&bootstrap做一个界面的CRUD有多简单

    我们在项目开发中,做得最多的可能就是CRUD,那么我们如何在ASP.NET MVC中来做CRUD呢?如果说只是单纯实现功能,那自然是再简单不过了,可是我们要考虑如何来做得比较好维护比较好扩展,如何做得 ...

  7. (Demo分享)利用JavaScript(JS)做一个可输入分钟的倒计时钟功能

    利用JavaScript(JS)实现一个可输入分钟的倒计时钟功能本文章为 Tz张无忌 原创文章,转载请注明来源,谢谢合作! 网络各种利用JavaScript做倒计时的Demo对新手很不友好,这里我亲手 ...

  8. JS定时器做物体运动

    JS定时器是函数 setInterval(函数体/函数名  , 时间) 清楚定时器 clearInterval(函数) 时间单位(毫秒) 1000毫秒  = 1秒 首先我们要知道用JS定时器能干什么? ...

  9. js是什么?js可以做什么?js的构成与学习方向

    js(百度官方介绍javascript)编程的基本语言学习目标是:a.怎么写和运行js脚本b.理解变量和值c.学会简单的数学运算符d.数据类型是什么e.流程控制 对于JavaScript的背景知识和结 ...

随机推荐

  1. iOS-关于创建真机调试证书(发布证书,测试证书,推送调试证书)【转】

  2. js 常用操作 -- 持续更新

    替换数组中某一元素: array.splice(2, 1, '哈哈'); // 2 表示指定数组中2下标元素,1表示要删除的项数,哈哈 是替换后的值 在数组中某元素之前增加元素: array.spli ...

  3. java23种设计模式之十:责任链模式

    最近在学习netty中发现其中用到了责任链模式,然后结合自己在写代码中遇到了大量写if...else的情况,决定学习一下责任链模式. 一.什么样的场景下会选择用责任链模式 我们在进行业务逻辑判断时,需 ...

  4. C之volatile

    https://blog.csdn.net/vay0721/article/details/79035854 https://blog.csdn.net/kaychangeek/article/det ...

  5. Python18之函数定义及调用,注释

    一.函数定义 def 函数名(形参1,形参2...): 函数体 return 返回值         (可以返回任何东西,一个值,一个变量,或是另一个函数的返回值,如果函数没有返回值,可以省略retu ...

  6. DjangoRestful 递归嵌套序列化器实现

    **** 由于博客园不支持markdown语法,所以推荐以下链接阅读: 原创 https://blog.csdn.net/weixin_42495873/article/details/8943354 ...

  7. Smart3D飞控&地方坐标系

    资源 ContextCapture(原Smart3D)教程 | Wish3D 航测数据处理答疑55问!涉及CC.Pix4D.Photoscan.EPS等常见软件问题_云进行 飞控软件 Smart3D常 ...

  8. vue 写一个瀑布流插件

    效果如图所示: 采用了预先加载图片,再计算高度的办法..网络差的情况下,可能有点卡 新建 vue-water-easy.vue  组件文件 <template> <div class ...

  9. ubuntu配置fastdfs+Nginx

    全程参考主线来自:https://blog.csdn.net/xiaoxie762457/article/details/80690841(文中图片失效不造成影响) Nginx安装主要参考:https ...

  10. java.lang.AbstractMethodError: null

    在使用springcloud的时候运行报这个错,原因是版本冲突导致的,在idea中创建springcloud项目的时候,这里默认是${spring-cloud.version},但是如果你使用的是高版 ...