dp.SyntaxHighlighter是一个不错的源代码语法高亮插件,用于你的页面中通过js来动态实现语法高亮显示你的源代码。
使用js脚本来动态进行代码着色的一个明显的好处在于:不会对原始的代码进行修改,保证原始代码的正确性(基本上所有的通过语法解析然后对字符串添加<span></span>来进行着色的话或多或少会产生解析错误,并且增加文件大小)。但同时执行效率将有赖于客户端机器的性能。目前此脚本支持的语言类型包括:
- c#, c-sharp, csharp
- vb, vb.net
- delphi, pascal
- js, jscript, javascript
- php
- py, python
- sql
- xml, xhtml, xslt, html, xhtml
<script src="plug-ins/SyntaxHighlighter/shCore.js"></script>
使用方法简介:
1. 把你需要进行代码高亮的源代码部分放置在特定的textarea中。
<script src="plug-ins/SyntaxHighlighter/shBrushJScript.js"></script>
2. 在所有textarea之后放置以下代码。
<script src="plug-ins/SyntaxHighlighter/shBrushXml.js"></script>
<script type="text/javascript"></script>
添加之后的效果正如本文的代码演示。
缺省情况下代码显示区域宽度为100%,即充满整个区域。如果需要固定显示区域的宽度(可以防止单行代码过长撑破页面布局),可以修改SyntaxHighlighter.css样式文件中的 .dp-highlighter 样式的宽度,把100%改为你想要的px数值即可。