使用Javascript突出显示代码的语法

时间:2008-10-02 02:57:33

标签: javascript html syntax syntax-highlighting

您可以推荐哪些Javascript库用于语法突出显示< code> HTML中的块?

(每个答案都有一个建议)。

13 个答案:

答案 0 :(得分:103)

StackOverflow使用Prettify库。

答案 1 :(得分:45)

我最近开发了一种名为彩虹的产品。

主要的设计目标是使核心库非常小,并使开发人员可以轻松扩展。

请参阅http://rainbowco.de

答案 2 :(得分:26)

答案 3 :(得分:15)

jQuery Syntax Highlighter是一个基于Google's Prettify的新版本 - 一个真正非常受欢迎的纯JavaScript语法荧光笔。

它支持codepre块之类的东西,能够使用像language-javascript这样的类名来表示我们希望它突出显示,以及wordwrap。您可以通过正常选择来复制和粘贴代码,而不必像许多其他人一样打开原始视图。可以使用HTML5数据属性data-sh或通过在初始化时指定选项进一步自定义。一个很好的稳定选择,定期更新。

答案 4 :(得分:15)

Lea Verou的Prism怎么样?

根据她在2012年6月发布的blog post声明:

  
      
  • 这很小。核心只有1.5KB缩小和gzip压缩。
  •   
  • 这是令人难以置信的可扩展性。不仅可以轻松添加新语言(这些日历中每种语法都是高亮显示),而且还可以   扩展现有的。
  •   
  • 它通过Web Workers支持并行性,以便在某些情况下获得更好的性能。
  •   
  • 它不会强制您使用任何Prism特定的标记,甚至不是Prism特定的类名,只有您应该使用的标准标记   无论如何。所以,你可以试试一段时间,如果你不这样做就把它删除   喜欢它,不留任何痕迹。
  •   

答案 5 :(得分:5)

答案 6 :(得分:5)

如果您正在使用jQuery,那就是Chilli:

http://code.google.com/p/jquery-chili-js/

您所要做的就是包括jquery-chili.js和recipes.js,然后点亮

$("code").chili();

它应该自己弄清楚语言。

答案 7 :(得分:5)

我对 SHJS 非常满意。它支持一大堆语言,看起来非常快速和准确。

以下是我在 my blog 上使用它的示例。我正在使用我自己的自定义CSS文件来模拟 Coda's 语法突出显示。如果您想使用它,请给我发电子邮件。

答案 8 :(得分:4)

jQuery.Syntax是一种极其快速且轻量级的语法高亮显示器。它具有语法源文件的动态加载,并使用CSS或模型很好地集成。

它是专为填补空白而开发的 - 即:快速,干净,客户端语法解析器。

答案 9 :(得分:3)

我不是在争论,但只是认为值得一提的是,如果你使用CMS或博客平台,那么使用后端荧光笔更好是因为显而易见的原因 - 看看Geshi({{3如果你有兴趣的话。实际上,您可以设置服务器以通过后端技术解析HTML内容 - 因此根本不需要JS高亮显示器。 (他们添加的唯一功能是能够打印/复制[使用swf]。)

答案 10 :(得分:3)

如果您要在浏览器内编辑器中查找语法突出显示,请尝试CodeMirror

答案 11 :(得分:2)

答案 12 :(得分:2)

This article at the Web Resources Depot列出了一系列突出显示代码的选项,其中一些使用Javascript。它于2009年5月4日发布。