SyntaxHighlighter语法高亮JS使用方法
2014-02-20
SyntaxHighlighter,是一款用于web页面的代码着色工具,可以用来着色多种语言,可以是 HTML,CSS,Javascript,还可以是C,JAVA等编程语言。它可以在网页中对各种程序源代码语法进行加亮显示。支持当前流行的各种编程语言:C#、CSS、C++、Delphi、Java、JavaScript、PHP、Python、Ruby、SQL、Visual Basic、XML / HTML,不得不说,高端大气上档次~~
1、假设网页文件test.htm存放在一个目录,将dp.SyntaxHighlighter解压缩,并复制其中的Scripts文件夹和styles文件夹,确保和test.html在同一个目录下面。
2、在网页的之间插入以下代码:
<link href=”Styles/SyntaxHighlighter.css” rel=”stylesheet” type=”text/css” />
3、在网页要显示程序源代码的地方插入以下代码,若是HTML类型的话,用XML(其它的如class=”js”表示以js语法显示源代码,其他可设定的class值分别为c#、css、c、elphi、java、js、php、python、ruby、sql、vb、xml):
<textarea cols=”100″ name=”code” rows=”15″>程序源代码放在这儿</textarea>
说明:
name=”code”是必须的,不能更改;
class=”xml”是着色的方式,即需要着色的代码的类型,根据需要进行更改。
4、在网页尾部的之前插入以下代码:
<script type=”text/javascript” src=”Scripts/shCore.js”></script><script type=”text/javascript” src=”Scripts/shBrushCSharp.js”></script>
<script type=”text/javascript” src=”Scripts/shBrushPhp.js”></script><script type=”text/javascript” src=”Scripts/shBrushJScript.js”></script>
<script type=”text/javascript” src=”Scripts/shBrushJava.js”></script><script type=”text/javascript” src=”Scripts/shBrushVb.js”></script>
<script type=”text/javascript” src=”Scripts/shBrushSql.js”></script><script type=”text/javascript” src=”Scripts/shBrushXml.js”></script>
<script type=”text/javascript” src=”Scripts/shBrushDelphi.js”></script><script type=”text/javascript” src=”Scripts/shBrushPython.js”></script>
<script type=”text/javascript” src=”Scripts/shBrushRuby.js”></script><script type=”text/javascript” src=”Scripts/shBrushCss.js”></script>
<script type=”text/javascript” src=”Scripts/shBrushCpp.js”></script><script type=”text/javascript”>// <![CDATA[
dp.SyntaxHighlighter.HighlightAll(‘code’);
// ]]></script>
电脑老师刚刚和我说的,电脑课发个博文备忘,下课了,我关机了。。。回家再研究。。