SyntaxHighlighter简介与使用

SyntaxHighlighter简介与使用 Posted on 2011-05-21 by tunpishuang 来自http://tunps.com/syntaxhighlighter-intro-and-using SyntaxHighlighter 是 Alex Gorbatchev 2004年开始开发的一个Javascript web客户端代码高亮库。 之前的主页在google code，现在已经转移到了alexgorbatchev.com。当前最新的版本是3.0.83，兼容的浏览器有：Internet Explorer 7.0 / Mozilla Firefox 3.0 / Google Chrome 0.2 / Safari 3.1 / Opera 9.6，IE6并不被支持。1.x的版本应该是支持的。 很多牛叉的站点在web中显示代码均使用SyntaxHighlighter，比如Apache, Aptana, Mozilla, Yahoo, WordPress, Bug Labs, Freshbooks，这里有详细列表。基本上所有的计算机编程语言都支持（通过Brush），参见这个列表。如果没有你需要的Brush，你可以自己写，写Brush JS也很简单。 使用SyntaxHighlighter也十分的简单,方法参见这里。有两种代码显示方式，第一种是使用

标签，然后指定brush，比如：class="brush: js"，方便在没开启js的浏览器中也能正常浏览代码，但是缺点是存在bug，所有的尖括号将会HTML转义（比如<专为<）。

另外是一个方式是方法，然后指定brush，比如：class="brush: js"，并且制定script的type属性为syntaxhighlighter，好处是无需HTML转义，将所有的代码放入CDATA中就行了。缺点是一般的RSS阅读器会自动去掉标签。

因为支持的语言有30多种，如果同时加载势必会占用过多的资源，所有syntaxhighlighter写了一个shAutoloader.js来自动加载所需要的js文件。

另外SyntaxHighlighter是可以通过切换主题来显示不同的效果的，主题文件有：

shCore.css
shCoreDefault.css
shCoreDjango.css
shCoreEclipse.css
shCoreEmacs.css
shCoreFadeToGrey.css
shCoreMDUltra.css
shCoreMidnight.css
shCoreRDark.css
shThemeDefault.css
shThemeDjango.css
shThemeEclipse.css
shThemeEmacs.css
shThemeFadeToGrey.css
shThemeMDUltra.css
shThemeMidnight.css
shThemeRDark.css

shCore.css是最基本的CSS，可以和各种shTheme*.css一起使用，或者单独使用shCore*.css，也就是2中方案：

shCore.css+shTheme*.css 
shCore*.css