簡書Markdown編輯器改進(jìn)

簡書不直接支持?jǐn)?shù)學(xué)公式,這十分遺憾。在開發(fā)人員反應(yīng)過來之前大概柯南都要結(jié)局了,既然自己有能力解決,那就開干了。

我預(yù)想是這樣的,塊級公式用帶tex類的代碼塊:

```tex
e^{ix} = \cos x + i\sin x
```
e^{ix} = \cos x + i\sin x

然后在普通內(nèi)聯(lián)公式呢,就用下面的辦法來實(shí)現(xiàn) $\lim_{x\rightarrow 0} \frac{sin x}x$,所有由 $ 包裹的代碼都將被當(dāng)作Latex代碼,為了防止跟其它代碼混淆,規(guī)定 $ 跟 ` 之間不能有空格。

`$\lim_{x\rightarrow 0} \frac{sin x}x$`
理想的效果圖

方法

在Firefox的Greasemonkey或者Chrome的TamperMonkey中添加這一段UserScript:

// ==UserScript==
// @name        jianshu-extension
// @namespace   your-namespace
// @include     http://*.jianshu.com/*
// @version     1
// @grant       none
// ==/UserScript==

var base_url = "http://latex.codecogs.com/gif.latex?";

function replaceLatex() {
  $('.preview code.tex').each(function () {
    var pre = $(this).parent("pre");
    var latex = $(this).text();
    var url = base_url + encodeURI(latex);

    pre.replaceWith('<img src="'+url+'" alt="'+latex+'" '+
        'style="display: block; margin: 20px; margin-left: auto; margin-right: auto;" />');
  });
  
  $('.preview code').each(function() {
    var latex = $(this).text().match(/^\$(.+)\$$/);
    if(!latex) return; else latex = latex[1];
    var url = base_url + encodeURI(latex);
    $(this).replaceWith('');
  });
  
  $('.main textarea.text')
      .css("font-family", '"courier"')
      .css("line-height", "18px")
      .css("font-size", "14px");
}

setInterval(replaceLatex, 1000);

如果沒有辦法安裝這個代碼,直接按F12打開調(diào)試器把代碼貼進(jìn)去也可以。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容