先让大家看个直观的效果:
【项目结构图】
【高亮代码图(默认是C#,读者可以根据注释自行修改成为其它语言)】
【效果图(1)】
【效果图(2)】
这一篇本来想命名为“基于文件驱动的网站开发”的续篇的,可是想想,还是单独列出标题比较清晰,故用当前的名称。
基于文件驱动的网站开发那篇,请参考:http://www.cnblogs.com/OceanChen/archive/2009/02/04/1383794.html
在没有高亮方法时,我们常常自己写样式,当然也有直接使用微软的Word转换成HTML来实现,可是转换出来的HTML冗余非常大。
其实这个不是什么高深的技术了,只是利用Google提供的【SyntaxHighlighter 2.0】库来实现的,如果要下载【SyntaxHighlighter 2.0】请参考如下地址:http://code.google.com/p/syntaxhighlighter/
我写这系列文章主要是考虑这样一个场景:
如果您租用过虚拟服务器就肯定遇到这样的问题,只是数据库的,要另外收钱,而且价格很高!说不定比您的虚拟服务器的价格还高呢!这也是我为什么要写基于文件驱动网站的一个原因,一来可以有效利用我们租用的磁盘空间,二来可以省去数据库【省钱】。
假如说我们打算写个基于文件驱动的【技术】博客,为了客户端用户阅读方面,我们基本上会使用高亮代码来实现,就像这个博客园,我们贴代码的时候都会用到【插入代码】功能来高亮我们的代码,这也正是我写这篇文章的目的,从此您就不必为高亮代码而忧虑了!
好了,不多说了,上代码:
<% @ Page Language = " C# " AutoEventWireup = " true " ValidateRequest = " false " %> <! DOCTYPE html PUBLIC " -//W3C//DTD XHTML 1.0 Transitional//EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " > < html xmlns = " http://www.w3.org/1999/xhtml " > < head > < title > dp.SyntaxHighlighter </ title > < link type = " text/css " rel = " stylesheet " href = " dp.SyntaxHighlighter/Styles/SyntaxHighlighter.css " /> < script src = " dp.SyntaxHighlighter/Scripts/shCore.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushCpp.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushCSharp.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushCss.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushDelphi.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushJava.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushJScript.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushPhp.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushPython.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushRuby.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushSql.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushVb.js " type = " text/javascript " ></ script > < script src = " dp.SyntaxHighlighter/Scripts/shBrushXml.js " type = " text/javascript " ></ script > < script language = " javascript " type = " text/javascript " > function getCode(name,css) { document.getElementById(name).className = css; dp.SyntaxHighlighter.ClipboardSwf = ' dp.SyntaxHighlighter/Scripts/clipboard.swf ' ; dp.SyntaxHighlighter.HighlightAll(name); } </ script > </ head > < body > <!-- class = " CSharp " 中的CSharp与Scripts文件夹下的JS后缀相关, 比如说shBrushCSharp.js,则后缀为:CSharp,即把前面的shBrush 给去掉,详细参考如下代码: --> < textarea id = " code " name = " code " class = " CSharp " style = " height: 294px; width: 922px; " rows = " 15 " cols = "" > /// <summary> /// 绑定99个编号 /// </summary> /// <param name="ddlPosition"></param> void BindDataToPosition(DropDownList ddlPosition) { for ( int i = 1 ; i < 100 ; i ++ ) { ddlPosition.Items.Add(ConvertNumberToString(i)); } } </ textarea > < textarea id = " Textarea1 " name = " Textarea1 " class = " CSharp " style = " height: 294px; width: 922px; " rows = " 15 " cols = "" > /// <summary> /// 绑定99个编号 /// </summary> /// <param name="ddlPosition"></param> void BindDataToPosition(DropDownList ddlPosition) { for ( int i = 1 ; i < 130 ; i ++ ) { ddlPosition.Items.Add(ConvertNumberToString(i)); } } </ textarea > <!-- SyntaxHighlighter CSS and JavaScript --> < script language = " javascript " type = " text/javascript " > dp.SyntaxHighlighter.ClipboardSwf = ' dp.SyntaxHighlighter/Scripts/clipboard.swf ' ; dp.SyntaxHighlighter.HighlightAll( ' code ' ); </ script > < br /> < input id = " btnSubmit " type = " button " value = " C# " onclick = " getCode('Textarea1','CSharp'); " /> </ body > </ html >
上面的代码是全部的代码,当然您也可以下载项目,您只需下载这个项目直接可以跑了。
下载地址:
http://files.cnblogs.com/OceanChen/SynataxHighlighter.rar
如果您有更好的高亮代码方法,也请您不必吝啬,共享出来!谢谢了先。
转载于:https://www.cnblogs.com/OceanChen/archive/2009/02/27/1399710.html
相关资源:Winform.Net语法高亮显示代码编辑控件