JavaScript语法着色库 SyntaxHighlighter

作者:网络 来源:佚名 更新时间:2010-11-22 10:59:07 点击:

SyntaxHighlighter 是一套在浏览器上对各种代码进行语法着色的独立 JavaScript 库。

本站也使用此语法着色库。

软件首页 : http://alexgorbatchev.com/SyntaxHighlighter/

使用方法:

一,包含文件部分

<script type="text/javascript" src="scripts/shCore.js"></script>
<script type="text/javascript" src="scripts/shBrushCss.js"></script>
<script type="text/javascript" src="scripts/shBrushJScript.js"></script>

shCore.js是一个核心包,其次分别是shBrushCss.js、shBrushJScript.js,因为 只需要对javascript代码进行高亮,所以其它的语法包没有包含,把有用的JS包包含就行,这样一方面有利于减少代码,另一方面加速网页打开的速度。

其次就是两个核心的CSS样式

<link type="text/css" rel="stylesheet" href="styles/shCore.css"/>
<link type="text/css" rel="stylesheet" href="styles/shThemeDefault.css"/>

这二个CSS样式是一定需要的,因为所有的显示控制都在这两个CSS样式文件中。

二,Javascript部分

<script type="text/javascript">
      SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf';
      SyntaxHighlighter.all();
</script>

这里有一个剪贴板配置,然后调用了一个all()方法,表示调用包含文件中的所用语法包。

 示例 及效果:
 

// SyntaxHighlighter makes your code
// snippets beautiful without tiring
// your servers.
// http://alexgorbatchev.com
var setArray = function(elems) {
    this.length = 0;
    push.apply(this, elems);
    return this;
}