解析縮減爲HTML和突出顯示代碼語法

我已經下載了一個Markdown JS library但我不知道它是否支持語法高亮或他支持的兩種方言（gruber/maruku）中的任何一種，因爲它第一次嘗試爲我的網頁添加降價支持。所以，我想知道如何將語法突出顯示器（如Alex Gorbatchev's JS library）集成到降價。解析縮減爲HTML和突出顯示代碼語法

歡迎任何其他圖書館。基本上，我降價片段是在.md文件加載這樣：

<div class="markdown-f"> 
    <?= file_get_contents("file.md"); ?> 
</div>

，它包含的代碼片段與普通文本降價在一起。我需要一個JS庫，能夠做這樣的事情的：

<script> 
    $('.markdown-f').each(function() { 
     var contents = $(this).text(); 
     $(this).empty(); 
     contents = markdown.toHTML(contents); 
     $(this).text(contents); 
    }); 
</script>

用方言或任何其他hacktrick支持語法高亮（手動指定例如目標語言）。

來源

2016-11-14 Peregring-lk

我用Alex Gorbatchev's JS library來做到這一點，它的效果很好。

首先，您應該創建一個像這樣的<pre>元素;

<pre class="brush: __yourFileType__"> + data + </pre>

data指的是你contents和__yourFileType__可以one of these。

例：class="brush: xml" , class="brush: txt"

之後，你只需簡單地調用它;

SyntaxHighlighter.highlight();

來源

2016-11-14 14:01:38 Qsprec

但是，我可以在標記文本中插入html元素嗎？在這種情況下，我不能使用縮進語法來指定代碼塊不是嗎？ –

當然你可以插入html元素。 @ Peregring-lk – Qsprec

@ Peregring-lk你可以看到一個例子[here]（http://alexgorbatchev.com/SyntaxHighlighter/manual/demo/）。 – Qsprec

我用的是上my website降價解析器來顯示我創建回購的自述文件。它包裝在<pre><code> code goes here </code></pre>

它不使用突出，但你可以使用你提到的其他庫中的代碼塊調用後：

$("code").addClass("brush: js") // assuming you want to highlight javascript

來源

2016-11-14 14:07:11

如果我有不同的語言片段，該怎麼辦？ –

然後，用於添加類的JavaScript將不得不針對不同的降價文件進行定製。 –

例如：'$（$（「代碼」）[0]）addClass（「刷：JS」）; $（$（「code」）[1]）。addClass（「brush：py」）;' –

最後我用highlightjs。

的@ A.OzanEkici解決方案具有我失去了我的文本編輯器的降價highglighting的（小）下行（Emacs的的markdown-mode），因爲<pre>標籤裏面的內容必須是取消縮進到看不到縮進，並且@ JaredBeach也不起作用，因爲Alex Gorbatchev的庫只能在<pre>標記上工作，而不能在<pre><code>標記上工作，這是標記語法所取代的。

所以，我的解決方式是：

<script> 
    $('.markdown-f').each(function(){ 
     $(this).html(markdown.toHTML($(this).text())); 
    }); 

    hljs.initHighlightingOnLoad(); 
</script>

和具有該語言系統會自動檢測adventage。

來源

2016-11-14 16:08:53

解析縮減爲HTML和突出顯示代碼語法

回答

相關問題