解析缩减为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和突出显示代码语法

回答

相关问题