Google Code Prettify实现代码高亮
Google Code Prettify是谷歌推出的一款轻量级的代码高亮项目，效果虽然略逊 highlight.js ，但 prettify 非常小巧，使用它来实现代码高亮显示也相当不错。下边我们简单看看 prettify.js 的使用方法。
- Pretify 项目地址：https://github.com/google/code-prettify
- Pretify 的一些样式：http://jmblog.github.io/color-themes-for-google-code-prettify/
从上面地址中下载 prettify.js 和 prettify.css 文件。
1 引入JS文件
<script type="text/javascript" src="jquery-1.6.1.min.js"></script> <script type="text/javascript" src="prettify.js"></script> <!--样式文件--> <link rel="stylesheet" src="prettify.css" />
2 调用 prettify
在<body>标签上添加调用方法，如下：
<body onload="prettyPrint()">
<!--页面内容-->
</body>
将你需要高亮显示的代码片断放在<pre>标记里，如下：
<pre class="prettyprint">
/* 你的代码片断 */
</pre>
这样就可以试下代码高亮了，但每次手动为<pre>标签添加prettyprint类，显示有些麻烦，使用下边的方法解决这个问题。
附 小技巧
页面中加入如下的一段Javascript代码，就可以不需要第2步了。
<script type="text/javascript">
$(document).ready(function(){
$("pre,code").addClass("prettyprint");
prettyPrint();
});
</script>
为了提高页面加载速度，我们应该将引用的 js 文件放置在底部。