來自 Google 的代碼高亮工具 Syntaxhighlighter_2.1.364

2010-02-07

昨天去PHP愛好者網(wǎng)站，看到一個(gè)不錯(cuò)的日歷代碼，覺得有不錯(cuò)的學(xué)習(xí)價(jià)值，就轉(zhuǎn)到自己的網(wǎng)站來了。但是發(fā)現(xiàn)，自己的代碼高亮顯示并不夠他的那么好看。我之前一直使用的是 google-syntax-highlighter 1.5.1. Released on August 5, 2007。是07年發(fā)布的工具。感覺class為php時(shí)，代碼的顯示并不是那么智能，比如關(guān)鍵字、數(shù)據(jù)結(jié)構(gòu)等等，高亮方式并不理想。

現(xiàn)在我使用了最新的 Syntaxhighlighter_2.1.364，下面是版本歷史：

• 1.5. Released on May 11, 2007.
• 1.5.1. Released on August 5, 2007.
• 2.0. Released on February 3, 2009.

SyntaxHighlighter是一款用JavaScript編寫的功能強(qiáng)大的代碼高亮顯示工具，它可以在網(wǎng)頁中對各種程序源代碼語法進(jìn)行高亮顯示。當(dāng)前最新版本是2.0.296，目前支持的編程語言為：Bash/shell、C#、C++、CSS、Delphi、Diff、Groovy、JavaScript、Java、Perl、PHP、Plain Text、Python、Ruby、Scala、SQL、Visual Basic、XML/XHTML/XSLT/HTML。

可以看一下它的 js 文件組織就知道了。

• shBrushBash.js
• shBrushCpp.js
• shBrushCSharp.js
• shBrushCss.js
• shBrushDelphi.js
• shBrushDiff.js
• shBrushGroovy.js
• shBrushJava.js
• shBrushJScript.js
• shBrushPhp.js
• shBrushPlain.js
• shBrushPython.js
• shBrushRuby.js
• shBrushScala.js
• shBrushSql.js
• shBrushVb.js
• shBrushXml.js

新版本的 SyntaxHighlighter 比上一個(gè)版本，增加了對幾種新語言的支持，比如 Groovy 和 Scala 等等。如果你有意去學(xué)習(xí)這些新語言，還是需要更新這個(gè)工具。

在SyntaxHighlighter目錄的styles目錄中一共提供了6個(gè)樣式文件，分別是shThemeDefault.css、shThemeDjango.css、shThemeEmacs.css、shThemeFadeToGrey.css、shThemeMidnight.css、shThemeRDark.css，可以根據(jù)自己喜歡的樣式來載入不同的樣式文件。

在以上代碼載入的19個(gè)js文件中，除了第一個(gè)shCore.js外，其他的都是每個(gè)js文件對應(yīng)一種編程語言(根據(jù)文件名可以判斷支持哪種編程語言)，可以根據(jù)實(shí)際需要來選擇是否載入。

將需要進(jìn)行高亮顯示的源代碼放在<pre></pre>之間，例如：

其中c-sharp是定義編程語言的類型，關(guān)于其他類型編程語言的定義方法，詳見下表的Brush aliases列：

現(xiàn)在開始，代碼部分基本都使用這個(gè)高亮工具了。