使用 Google Prettify 实现代码高亮

今天这篇文章主要讲述使用 google-code-prettify 来实现代码的高亮显示，prettify 非常小巧且配置简单，使用它来实现代码的高亮显示是个不错的选择。

下边我们简单看看 prettify.js 的使用方法：

1.引入 jQuery 文件和 prettify.js 文件

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script>
<script src="prettify.js"type="text/javascript"></script>
<link href="/prettify.css" type="text/css" rel="stylesheet" />
2.调用 prettify.js 实现代码高亮

在 body 标签上添加调用方法，如下：
<body onload="prettyPrint()">
</body>
将你需要高亮显示的代码片断放在 pre标记里，如下：
<pre class="prettyprint">
    @*你的代码片断*@
</pre>

使用jQuery小技巧实现优化

上述方法可以实现代码的高亮，但每次手动为pre标签添加"prettyprint"类，显示有些麻烦。
使用下边的代码片断来解决这个问题并替换掉 body 的"onload"的事件，实现分离：

$(window).load(function(){
　　$("pre").addClass("prettyprint"); prettyPrint();
})

到这我们应该已经成功使用 prettify.js 实现了代码的高亮显示，为了提高页面加载速度，我们应该将引用的js文件放置在底部
下载地址：http://code.google.com/p/google-code-prettify/