shawl.qiu Javascript 语法高亮函数 v1.0

shawl.qiu Javascript 语法高亮函数 v1.0

 说明:
 很久前就想写一个语法高亮的函数了, 不过因为N多原因, 因此没有写.
 现在所有条件都具备了, 不写对不起自己对不起广大人民群众呀.
 
 
  1. /*------------------------------------------------------------*/
  2. * shawl.qiu Javascript 语法高亮函数 v1.0
  3. * ---/----------------------------------
  4. * 参数说明:
  5. * sStr: 字符串, 要进行语法高亮的字符串.
  6. * sOpt: 字符串, 要进行语法高亮的语言, all 为编码全部可用语法(目前只有 xml, javascript 选项).
  7. * 注: 后续版本将会逐渐支持: css, html, xhtml, asp/vbscript,
  8. * asp/jscript, c#.net, Jscript.net, T-SQL.
  9. * 特别注意: 本函数采用 ###字符### 作为特别标记, 因此, 为了不出错,请将 # 字符进行编码.
  10. * 如: # -> #
  11. /*------------------------------------------------------------*/
 目录:
 1. 函数 fHighlight(sStr, sOpt)
 2. 使用演示.
 
 shawl.qiu
 2006-12-11
 http://blog.csdn.net/btbtd  
 
 1. 函数 fHighlight(sStr, sOpt)
 
 
  1. <script type="text/javascript">
  2. //<![CDATA[
  3. /*------------------------------------------------------------*/
  4. * shawl.qiu Javascript 语法高亮函数 v1.0
  5. * ---/----------------------------------
  6. * 参数说明:
  7. * sStr: 字符串, 要进行语法高亮的字符串.
  8. * sOpt: 字符串, 要进行语法高亮的语言, all 为编码全部可用语法(目前只有 xml, javascript 选项).
  9. * 注: 后续版本将会逐渐支持: css, html, xhtml, asp/vbscript,
  10. * asp/jscript, c#.net, Jscript.net, T-SQL.
  11. * 特别注意: 本函数采用 ###字符### 作为特别标记, 因此, 为了不出错,请将 # 字符进行编码.
  12. * 如: # -> &#35;
  13. /*------------------------------------------------------------*/
  14. //-------------------------begin function fHighlight(sStr, sOpt)-----------------------//
  15. function fHighlight(sStr, sOpt){
  16. if(!sStr||sStr.replace(//s+/g,'').length<0)return false;
  17. if(!sOpt) var sOpt='all';
  18. sOpt=sOpt.toLowerCase();
  19. try{return rpls(sStr, sOpt)}catch(e){};
  20. function rpls(sStr, sOpt){
  21. if(!sOpt) var sOpt='all';
  22. //------------------------------begin script
  23. if(//bjavascript/b/ig.test(sOpt)||sOpt=='all'){
  24. sStr=sStr.replace(//&lt/;script.*?/&gt/;[/s/S]*?/&lt/;//script/&gt/;/gi,
  25. function (m){
  26. m=m.replace(/(/&lt/;script.*?/&gt/;)([/s/S]*?)(/&lt/;//script/&gt/;)/ig, function ($1,$2,$3,$4){
  27. $2=$2.replace(//&lt/;script.*?/&gt/;/ig, function (m_){
  28. m_=m_.replace(/([a-z]+)/=(/'|/")(/S+)/2/gi,
  29. '<span style="color:blue;">$1</span>=$2<span style="color:fuchsia;">$3</span>$2');
  30. m_=m_.replace(//&lt/;script/i,'/&lt/;<span style="color:red">script</span>');
  31. return m_;
  32. });
  33. // main block
  34. $3=$3.replace(/(/!/=/=|/=/=/=)/g,'###$1###');
  35. $3=$3.replace(/([^#=!*///])(/!/=|/=/=)/g,'$1###$2###');
  36. $3=$3.replace(/([^#=!*///])(/=)/g,'$1###$2###');
  37. $3=$3.replace(/([/w]+)/.([^!=><]*)(/(|/[/{|)([^!=><]*)(/)|/}|/})/gi,function(m_){
  38. m_=m_.replace(/(/(|/[|/{)(.*?)(/}|/]|/))/gi,'$1<span style="color:fuchsia">$2</span>$3');
  39. return m_.fontcolor('blue');
  40. })
  41. $3=$3.replace(/([a-z.0-9/[/]/-/+_]+)( |)([#]{3}(/!|/=|/*|//))/gi,function($1_,$2_, $3_, $4_){
  42. if(/(/[|/()/.test($2_)>-1){
  43. $2_=$2_.replace(/(/[|/))(.*?)(/)|/])/g,'$1<span style="color:fuchsia;">$2</span>$3' );
  44. }
  45. $2_='<span style="color:blue;">'+$2_+'</span>';
  46. return $2_+$3_+$4_;
  47. })
  48. $3=$3.replace(/([#]{3}[^a-z0-9]*?[#]{3})([^<>]+)/g, function($1_, $2_, $3_){
  49. $3_=$3_.replace(/(/{|/(|/[)([^/(/{/[]+)(/)|/}|/])/g,
  50. '$1<span style="color:fuchsia;">$2</span>$3');
  51. $3_='<span style="color:red;">'+$3_+'</span>';
  52. return $2_+$3_;
  53. })
  54. var re=new RegExp('(else|if|while|alert|var|try|catch|finaly|for|switch|case|'+
  55. 'default|function|return|break|null|false|true|new)','gi');
  56. $3=$3.replace(re,function($1){
  57. $1='<span style="font-weight:bold;">'+$1+'</span>';
  58. return $1;
  59. });
  60. // CDATA
  61. $3=$3.replace(/(/!/[)(CDATA)(/[)/gi,'$1<span style="font-weight:bold;">$2</span>$3');
  62. $3=$3.replace(/[#]{3}(.+?)[#]{3}/gi,'<span style="color:orange;">$1</span>');
  63. $3=$3.replace(/([^<>]+)/g,'//<span style="color:ccc;">$1</span>');
  64. $3=$3.replace(*[/s/S]*?/*///g,function(m_){
  65. m_=m_.replace(/>([/s/S]*?)</g,'><span style="color:#ccc;">$1</span><');
  66. return m_;
  67. });
  68. $3=$3.replace(*([^<>]+)/*///g,'/*<span style="color:#ccc">$1</span>*/');
  69. $4=$4.replace(/script/i,'<span style="color:red">script</span>');
  70. return $2+$3+$4;
  71. });
  72. return m;
  73. });
  74. }
  75. //------------------------------end script
  76. // begin xml
  77. if(//bxml/b/gi.test(sOpt)||sOpt=='all'){
  78. // XML
  79. sStr=sStr.replace(//&lt/;/?xml[^><]+(/&gt/;|)/gi, function(m){
  80. m=m.replace(/[a-z]+/=(/'|/").*?/1/gi,function(m_){
  81. m_=m_.replace(/(/'|")(.*?)/1/, '$1<span style="color:fuchsia;">$2</span>$1')
  82. m_=m_.replace(/(.*?)/=/,'<span style="color:blue;">$1</span>=');
  83. return m_;
  84. });
  85. m=m.replace(//?([a-z-]+)/i,'?<span style="color:red;">$1</span>')
  86. return m;
  87. } );
  88. // ELEMENT
  89. sStr=sStr.replace(//&lt/;/!ELEMENT[^><]+(/&gt/;|)/gi, function(m){
  90. m=m.replace(/ ([^(?,*+)|]+) /gi,' <span style="color:blue;">$1</span> ');
  91. m=m.replace(/(!ELEMENT)/gi,'<span style="color:red;">$1</span>');
  92. m=m.replace(//(([/s/S]+)/)/gi,function ($1){
  93. return $1.replace(/([/S]+)/gi,'<span style="color:fuchsia;">$1</span>')
  94. }
  95. );
  96. return m;
  97. } );
  98. // ATTLIST
  99. sStr=sStr.replace(//&lt/;/!ATTLIST[^><]+(/&gt/;|)/gi, function(m){
  100. // &lt;!ATTLIST title id CDATA #IMPLIED&gt;
  101. m=m.replace(/ ([^#]+)/g, ' <span style="color:blue;">$1</span>');
  102. m=m.replace(/([#][^&]+)/g,'<span style="color:fuchsia">$1</span>');
  103. m=m.replace(/(!ATTLIST)/gi,'<span style="color:red;">$1</span>');
  104. return m;
  105. } );
  106. // ATTLIST 1
  107. sStr=sStr.replace(//&lt/;/!ATTLIST[^><]+(/&gt/;|)/gi, function(m){
  108. m=m.replace(/ ([^'!<>"" ]+)/gi,' <span style="color:blue">$1</span>');
  109. m=m.replace(//!(ATTLIST)/i,'!<span style="color:red;">$1</span>');
  110. m=m.replace(/([^=])(/'|/")([^/<> ]+)/2/g,'$1$2<span style="color:fuchsia;">$3</span>$2');
  111. return m;
  112. } );
  113. // DOCTYPE
  114. sStr=sStr.replace(//&lt/;/!DOCTYPE[^><]+(/&gt/;|)/[/gi, function(m){
  115. m=m.replace(/ (/S+) /gi,' <span style="font-weight:bold">$1</span> ');
  116. m=m.replace(//!(DOCTYPE)/gi, '!<span style="color:red">$1</span>');
  117. return m;
  118. } );
  119. // IGNORE
  120. sStr=sStr.replace(//&lt/;/!/[ (IGNORE|INCLUDE)[^><]+(/]/]/&gt/;|/&gt/;|)/gi, function(m){
  121. m=m.replace(/(/&lt/;!/[) (IGNORE|INCLUDE)/,'$1 <span style="font-weight:bold">$2</span>');
  122. m=m.replace(/([^!])/[([/S ]+)/]/,'$1[<span style="color:fuchsia">$2</span>]')
  123. return m;
  124. } );
  125. // DOCTYPE 1
  126. sStr=sStr.replace(//&lt/;/!DOCTYPE[^><]+(/&gt/;|)/gi, function(m){
  127. m=m.replace(/ ([^'!<>"" ]+)/gi,' <span style="color:blue">$1</span>');
  128. m=m.replace(//!(DOCTYPE)/i,'!<span style="color:red;">$1</span>');
  129. m=m.replace(/([^=])(/'|/")([^/<> ]+)/2/g,'$1$2<span style="color:fuchsia;">$3</span>$2');
  130. return m;
  131. } );
  132. // NOTATION
  133. sStr=sStr.replace(//&lt/;/!NOTATION[^><]+(/&gt/;|)/gi, function(m){
  134. m=m.replace(/ ([^'!<>"" ]+)/gi,' <span style="color:blue">$1</span>');
  135. m=m.replace(//!(NOTATION)/i,'!<span style="color:red;">$1</span>');
  136. m=m.replace(/([^=])(/'|/")([^/<> ]+)/2/g,'$1$2<span style="color:fuchsia;">$3</span>$2');
  137. return m;
  138. } );
  139. // ENTYT(Y|IES)
  140. sStr=sStr.replace(//&lt/;/!ENTIT(Y|IES)[^><]+(/&gt/;|)/gi, function(m){
  141. m=m.replace(/ ([^'!<>"" ]+)/gi,' <span style="color:blue">$1</span>');
  142. m=m.replace(//!(ENTIT(Y|IES))/i,'!<span style="color:red;">$1</span>');
  143. m=m.replace(/([^=])(/'|/")([^/<> ]+)/2/g,'$1$2<span style="color:fuchsia;">$3</span>$2');
  144. return m;
  145. } );
  146. // </markup/>
  147. sStr=sStr.replace(//&lt/;(//|)[a-z0-9_/-:]+(/&gt/;| ///&gt/;|///&gt/;)/gi, function(m){
  148. m=m.replace(/(/&lt/;(//|))([a-z0-9_/-:]+)/gi,'$1<span style="color:red;">$3</span>');
  149. return m;
  150. } );
  151. // <markup pram='value'/>
  152. sStr=sStr.replace(/&lt;[^<>]+/=[^><]+(///&gt/;|/&gt/;|)/gi, function(m){
  153. m=m.replace(/([a-z:]+)( |)/=/gi,'<span style="color:blue;">$1</span>$2###=###');
  154. m=m.replace(/[#]{3}/=[#]{3}(/'|")([^<>'"]+)/g,
  155. '=$1<span style="color:fuchsia;">$2</span>');
  156. m=m.replace(//#{3}/=/#{3}/g,'=');
  157. m=m.replace(/(/&lt/;)([^<>]+)/,'$1<span style="color:red;">$2</span>');
  158. return m;
  159. } );
  160. }
  161. //------------------------------end xml
  162. return sStr;
  163. }
  164. }
  165. //-------------------------end function fHighlight(sStr, sOpt)-------------------------//
  166. onload=function(){
  167. document.body.innerHTML=fHighlight(document.body.innerHTML, 'javascript xml');
  168. }
  169. //]]>
  170. </script>
  171.  

 2. 使用演示.
 
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>shawl.qiu template</title>
  6. <script type="text/javascript">
  7. //<![CDATA[
  8. /*------------------------------------------------------------*/
  9. * shawl.qiu Javascript 语法高亮函数 v1.0
  10. * ---/----------------------------------
  11. * 参数说明:
  12. * sStr: 字符串, 要进行语法高亮的字符串.
  13. * sOpt: 字符串, 要进行语法高亮的语言, all 为编码全部可用语法(目前只有 xml, javascript 选项).
  14. * 注: 后续版本将会逐渐支持: css, html, xhtml, asp/vbscript,
  15. * asp/jscript, c#.net, Jscript.net, T-SQL.
  16. * 特别注意: 本函数采用 ###字符### 作为特别标记, 因此, 为了不出错,请将 # 字符进行编码.
  17. * 如: # -> &#35;
  18. /*------------------------------------------------------------*/
  19. //-------------------------begin function fHighlight(sStr, sOpt)-----------------------//
  20. function fHighlight(sStr, sOpt){
  21. if(!sStr||sStr.replace(//s+/g,'').length<0)return false;
  22. if(!sOpt) var sOpt='all';
  23. sOpt=sOpt.toLowerCase();
  24. try{return rpls(sStr, sOpt)}catch(e){};
  25. function rpls(sStr, sOpt){
  26. if(!sOpt) var sOpt='all';
  27. //------------------------------begin script
  28. if(//bjavascript/b/ig.test(sOpt)||sOpt=='all'){
  29. sStr=sStr.replace(//&lt/;script.*?/&gt/;[/s/S]*?/&lt/;//script/&gt/;/gi,
  30. function (m){
  31. m=m.replace(/(/&lt/;script.*?/&gt/;)([/s/S]*?)(/&lt/;//script/&gt/;)/ig, function ($1,$2,$3,$4){
  32. $2=$2.replace(//&lt/;script.*?/&gt/;/ig, function (m_){
  33. m_=m_.replace(/([a-z]+)/=(/'|/")(/S+)/2/gi,
  34. '<span style="color:blue;">$1</span>=$2<span style="color:fuchsia;">$3</span>$2');
  35. m_=m_.replace(//&lt/;script/i,'/&lt/;<span style="color:red">script</span>');
  36. return m_;
  37. });
  38. // main block
  39. $3=$3.replace(/(/!/=/=|/=/=/=)/g,'###$1###');
  40. $3=$3.replace(/([^#=!*///])(/!/=|/=/=)/g,'$1###$2###');
  41. $3=$3.replace(/([^#=!*///])(/=)/g,'$1###$2###');
  42. $3=$3.replace(/([/w]+)/.([^!=><]*)(/(|/[/{|)([^!=><]*)(/)|/}|/})/gi,function(m_){
  43. m_=m_.replace(/(/(|/[|/{)(.*?)(/}|/]|/))/gi,'$1<span style="color:fuchsia">$2</span>$3');
  44. return m_.fontcolor('blue');
  45. })
  46. $3=$3.replace(/([a-z.0-9/[/]/-/+_]+)( |)([#]{3}(/!|/=|/*|//))/gi,function($1_,$2_, $3_, $4_){
  47. if(/(/[|/()/.test($2_)>-1){
  48. $2_=$2_.replace(/(/[|/))(.*?)(/)|/])/g,'$1<span style="color:fuchsia;">$2</span>$3' );
  49. }
  50. $2_='<span style="color:blue;">'+$2_+'</span>';
  51. return $2_+$3_+$4_;
  52. })
  53. $3=$3.replace(/([#]{3}[^a-z0-9]*?[#]{3})([^<>]+)/g, function($1_, $2_, $3_){
  54. $3_=$3_.replace(/(/{|/(|/[)([^/(/{/[]+)(/)|/}|/])/g,
  55. '$1<span style="color:fuchsia;">$2</span>$3');
  56. $3_='<span style="color:red;">'+$3_+'</span>';
  57. return $2_+$3_;
  58. })
  59. var re=new RegExp('(else|if|while|alert|var|try|catch|finaly|for|switch|case|'+
  60. 'default|function|return|break|null|false|true|new)','gi');
  61. $3=$3.replace(re,function($1){
  62. $1='<span style="font-weight:bold;">'+$1+'</span>';
  63. return $1;
  64. });
  65. // CDATA
  66. $3=$3.replace(/(/!/[)(CDATA)(/[)/gi,'$1<span style="font-weight:bold;">$2</span>$3');
  67. $3=$3.replace(/[#]{3}(.+?)[#]{3}/gi,'<span style="color:orange;">$1</span>');
  68. $3=$3.replace(/([^<>]+)/g,'//<span style="color:ccc;">$1</span>');
  69. $3=$3.replace(*[/s/S]*?/*///g,function(m_){
  70. m_=m_.replace(/>([/s/S]*?)</g,'><span style="color:#ccc;">$1</span><');
  71. return m_;
  72. });
  73. $3=$3.replace(*([^<>]+)/*///g,'/*<span style="color:#ccc">$1</span>*/');
  74. $4=$4.replace(/script/i,'<span style="color:red">script</span>');
  75. return $2+$3+$4;
  76. });
  77. return m;
  78. });
  79. }
  80. //------------------------------end script
  81. // begin xml
  82. if(//bxml/b/gi.test(sOpt)||sOpt=='all'){
  83. // XML
  84. sStr=sStr.replace(//&lt/;/?xml[^><]+(/&gt/;|)/gi, function(m){
  85. m=m.replace(/[a-z]+/=(/'|/").*?/1/gi,function(m_){
  86. m_=m_.replace(/(/'|")(.*?)/1/, '$1<span style="color:fuchsia;">$2</span>$1')
  87. m_=m_.replace(/(.*?)/=/,'<span style="color:blue;">$1</span>=');
  88. return m_;
  89. });
  90. m=m.replace(//?([a-z-]+)/i,'?<span style="color:red;">$1</span>')
  91. return m;
  92. } );
  93. // ELEMENT
  94. sStr=sStr.replace(//&lt/;/!ELEMENT[^><]+(/&gt/;|)/gi, function(m){
  95. m=m.replace(/ ([^(?,*+)|]+) /gi,' <span style="color:blue;">$1</span> ');
  96. m=m.replace(/(!ELEMENT)/gi,'<span style="color:red;">$1</span>');
  97. m=m.replace(//(([/s/S]+)/)/gi,function ($1){
  98. return $1.replace(/([/S]+)/gi,'<span style="color:fuchsia;">$1</span>')
  99. }
  100. );
  101. return m;
  102. } );
  103. // ATTLIST
  104. sStr=sStr.replace(//&lt/;/!ATTLIST[^><]+(/&gt/;|)/gi, function(m){
  105. // &lt;!ATTLIST title id CDATA #IMPLIED&gt;
  106. m=m.replace(/ ([^#]+)/g, ' <span style="color:blue;">$1</span>');
  107. m=m.replace(/([#][^&]+)/g,'<span style="color:fuchsia">$1</span>');
  108. m=m.replace(/(!ATTLIST)/gi,'<span style="color:red;">$1</span>');
  109. return m;
  110. } );
  111. // ATTLIST 1
  112. sStr=sStr.replace(//&lt/;/!ATTLIST[^><]+(/&gt/;|)/gi, function(m){
  113. m=m.replace(/ ([^'!<>"" ]+)/gi,' <span style="color:blue">$1</span>');
  114. m=m.replace(//!(ATTLIST)/i,'!<span style="color:red;">$1</span>');
  115. m=m.replace(/([^=])(/'|/")([^/<> ]+)/2/g,'$1$2<span style="color:fuchsia;">$3</span>$2');
  116. return m;
  117. } );
  118. // DOCTYPE
  119. sStr=sStr.replace(//&lt/;/!DOCTYPE[^><]+(/&gt/;|)/[/gi, function(m){
  120. m=m.replace(/ (/S+) /gi,' <span style="font-weight:bold">$1</span> ');
  121. m=m.replace(//!(DOCTYPE)/gi, '!<span style="color:red">$1</span>');
  122. return m;
  123. } );
  124. // IGNORE
  125. sStr=sStr.replace(//&lt/;/!/[ (IGNORE|INCLUDE)[^><]+(/]/]/&gt/;|/&gt/;|)/gi, function(m){
  126. m=m.replace(/(/&lt/;!/[) (IGNORE|INCLUDE)/,'$1 <span style="font-weight:bold">$2</span>');
  127. m=m.replace(/([^!])/[([/S ]+)/]/,'$1[<span style="color:fuchsia">$2</span>]')
  128. return m;
  129. } );
  130. // DOCTYPE 1
  131. sStr=sStr.replace(//&lt/;/!DOCTYPE[^><]+(/&gt/;|)/gi, function(m){
  132. m=m.replace(/ ([^'!<>"" ]+)/gi,' <span style="color:blue">$1</span>');
  133. m=m.replace(//!(DOCTYPE)/i,'!<span style="color:red;">$1</span>');
  134. m=m.replace(/([^=])(/'|/")([^/<> ]+)/2/g,'$1$2<span style="color:fuchsia;">$3</span>$2');
  135. return m;
  136. } );
  137. // NOTATION
  138. sStr=sStr.replace(//&lt/;/!NOTATION[^><]+(/&gt/;|)/gi, function(m){
  139. m=m.replace(/ ([^'!<>"" ]+)/gi,' <span style="color:blue">$1</span>');
  140. m=m.replace(//!(NOTATION)/i,'!<span style="color:red;">$1</span>');
  141. m=m.replace(/([^=])(/'|/")([^/<> ]+)/2/g,'$1$2<span style="color:fuchsia;">$3</span>$2');
  142. return m;
  143. } );
  144. // ENTYT(Y|IES)
  145. sStr=sStr.replace(//&lt/;/!ENTIT(Y|IES)[^><]+(/&gt/;|)/gi, function(m){
  146. m=m.replace(/ ([^'!<>"" ]+)/gi,' <span style="color:blue">$1</span>');
  147. m=m.replace(//!(ENTIT(Y|IES))/i,'!<span style="color:red;">$1</span>');
  148. m=m.replace(/([^=])(/'|/")([^/<> ]+)/2/g,'$1$2<span style="color:fuchsia;">$3</span>$2');
  149. return m;
  150. } );
  151. // </markup/>
  152. sStr=sStr.replace(//&lt/;(//|)[a-z0-9_/-:]+(/&gt/;| ///&gt/;|///&gt/;)/gi, function(m){
  153. m=m.replace(/(/&lt/;(//|))([a-z0-9_/-:]+)/gi,'$1<span style="color:red;">$3</span>');
  154. return m;
  155. } );
  156. // <markup pram='value'/>
  157. sStr=sStr.replace(/&lt;[^<>]+/=[^><]+(///&gt/;|/&gt/;|)/gi, function(m){
  158. m=m.replace(/([a-z:]+)( |)/=/gi,'<span style="color:blue;">$1</span>$2###=###');
  159. m=m.replace(/[#]{3}/=[#]{3}(/'|")([^<>'"]+)/g,
  160. '=$1<span style="color:fuchsia;">$2</span>');
  161. m=m.replace(//#{3}/=/#{3}/g,'=');
  162. m=m.replace(/(/&lt/;)([^<>]+)/,'$1<span style="color:red;">$2</span>');
  163. return m;
  164. } );
  165. }
  166. //------------------------------end xml
  167. return sStr;
  168. }
  169. }
  170. //-------------------------end function fHighlight(sStr, sOpt)-------------------------//
  171. onload=function(){
  172. document.body.innerHTML=fHighlight(document.body.innerHTML, 'javascript xml');
  173. }
  174. //]]>
  175. </script>
  176. </head>
  177. <body>
  178. <div id="sqEditorMain" class="sqEditorMain"><pre class="sqPre"><ol><li>&lt;script type="text/javascript"&gt;</li><li>//&lt;![CDATA[</li><li> /*------------------------------------------------------------*/</li><li> * shawl.qiu Javascript 语法高亮函数 v1.0</li><li> * ---/----------------------------------</li><li> * 参数说明:</li><li> * sStr: 字符串, 要进行语法高亮的字符串.</li><li> * sOpt: 字符串, 要进行语法高亮的语言, all 为编码全部可用语法(目前只有 xml, javascript 选项). </li><li> * 注: 后续版本将会逐渐支持: css, html, xhtml, asp/vbscript, </li><li> * asp/jscript, c#.net, Jscript.net, T-SQL.</li><li> * 特别注意: 本函数采用 ###字符### 作为特别标记, 因此, 为了不出错,请将 # 字符进行编码.</li><li> * 如: # -&gt; &amp;#35; </li><li> /*------------------------------------------------------------*/</li><li> //-------------------------begin function fHighlight(sStr, sOpt)-----------------------//</li><li> function fHighlight(sStr, sOpt){</li><li> if(!sStr||sStr.replace(//s+/g,'').length&lt;0)return false;</li><li> if(!sOpt) var sOpt='all';</li><li> sOpt=sOpt.toLowerCase();</li><li> try{return rpls(sStr, sOpt)}catch(e){};</li><li> function rpls(sStr, sOpt){</li><li> if(!sOpt) var sOpt='all';</li><li> //------------------------------begin script</li><li> if(//bjavascript/b/ig.test(sOpt)||sOpt=='all'){</li><li> sStr=sStr.replace(//&amp;lt/;script.*?/&amp;gt/;[/s/S]*?/&amp;lt/;//script/&amp;gt/;/gi,</li><li> function (m){</li><li> m=m.replace(/(/&amp;lt/;script.*?/&amp;gt/;)([/s/S]*?)(/&amp;lt/;//script/&amp;gt/;)/ig, function ($1,$2,$3,$4){</li><li> $2=$2.replace(//&amp;lt/;script.*?/&amp;gt/;/ig, function (m_){</li><li> m_=m_.replace(/([a-z]+)/=(/'|/")(/S+)/2/gi,</li><li> '&lt;span style="color:blue;"&gt;$1&lt;/span&gt;=$2&lt;span style="color:fuchsia;"&gt;$3&lt;/span&gt;$2');</li><li> m_=m_.replace(//&amp;lt/;script/i,'/&amp;lt/;&lt;span style="color:red"&gt;script&lt;/span&gt;');</li><li> return m_;</li><li> });</li><li> // main block</li><li> $3=$3.replace(/(/!/=/=|/=/=/=)/g,'###$1###');</li><li> $3=$3.replace(/([^#=!*///])(/!/=|/=/=)/g,'$1###$2###');</li><li> $3=$3.replace(/([^#=!*///])(/=)/g,'$1###$2###');</li><li> $3=$3.replace(/([/w]+)/.([^!=&gt;&lt;]*)(/(|/[/{|)([^!=&gt;&lt;]*)(/)|/}|/})/gi,function(m_){</li><li> m_=m_.replace(/(/(|/[|/{)(.*?)(/}|/]|/))/gi,'$1&lt;span style="color:fuchsia"&gt;$2&lt;/span&gt;$3');</li><li> return m_.fontcolor('blue');</li><li> })</li><li> $3=$3.replace(/([a-z.0-9/[/]/-/+_]+)( |)([#]{3}(/!|/=|/*|//))/gi,function($1_,$2_, $3_, $4_){</li><li> if(/(/[|/()/.test($2_)&gt;-1){</li><li> $2_=$2_.replace(/(/[|/))(.*?)(/)|/])/g,'$1&lt;span style="color:fuchsia;"&gt;$2&lt;/span&gt;$3' );</li><li> }</li><li> $2_='&lt;span style="color:blue;"&gt;'+$2_+'&lt;/span&gt;';</li><li> return $2_+$3_+$4_;</li><li> })</li><li> $3=$3.replace(/([#]{3}[^a-z0-9]*?[#]{3})([^&lt;&gt;]+)/g, function($1_, $2_, $3_){</li><li> $3_=$3_.replace(/(/{|/(|/[)([^/(/{/[]+)(/)|/}|/])/g,</li><li> '$1&lt;span style="color:fuchsia;"&gt;$2&lt;/span&gt;$3');</li><li> $3_='&lt;span style="color:red;"&gt;'+$3_+'&lt;/span&gt;';</li><li> return $2_+$3_;</li><li> })</li><li> var re=new RegExp('(else|if|while|alert|var|try|catch|finaly|for|switch|case|'+</li><li> 'default|function|return|break|null|false|true|new)','gi');</li><li> $3=$3.replace(re,function($1){</li><li> $1='&lt;span style="font-weight:bold;"&gt;'+$1+'&lt;/span&gt;';</li><li> return $1;</li><li> });</li><li> // CDATA</li><li> $3=$3.replace(/(/!/[)(CDATA)(/[)/gi,'$1&lt;span style="font-weight:bold;"&gt;$2&lt;/span&gt;$3');</li><li> $3=$3.replace(/[#]{3}(.+?)[#]{3}/gi,'&lt;span style="color:orange;"&gt;$1&lt;/span&gt;');</li><li> $3=$3.replace(/([^&lt;&gt;]+)/g,'//&lt;span style="color:ccc;"&gt;$1&lt;/span&gt;');</li><li> $3=$3.replace(*[/s/S]*?/*///g,function(m_){</li><li> m_=m_.replace(/&gt;([/s/S]*?)&lt;/g,'&gt;&lt;span style="color:#ccc;"&gt;$1&lt;/span&gt;&lt;');</li><li> return m_;</li><li> });</li><li> $3=$3.replace(*([^&lt;&gt;]+)/*///g,'/*&lt;span style="color:#ccc"&gt;$1&lt;/span&gt;*/');</li><li> $4=$4.replace(/script/i,'&lt;span style="color:red"&gt;script&lt;/span&gt;');</li><li> return $2+$3+$4;</li><li> });</li><li> return m;</li><li> });</li><li> }</li><li> //------------------------------end script</li><li> // begin xml</li><li> if(//bxml/b/gi.test(sOpt)||sOpt=='all'){</li><li> // XML</li><li> sStr=sStr.replace(//&amp;lt/;/?xml[^&gt;&lt;]+(/&amp;gt/;|)/gi, function(m){</li><li> m=m.replace(/[a-z]+/=(/'|/").*?/1/gi,function(m_){</li><li> m_=m_.replace(/(/'|")(.*?)/1/, '$1&lt;span style="color:fuchsia;"&gt;$2&lt;/span&gt;$1')</li><li> m_=m_.replace(/(.*?)/=/,'&lt;span style="color:blue;"&gt;$1&lt;/span&gt;='); </li><li> return m_;</li><li> });</li><li> m=m.replace(//?([a-z-]+)/i,'?&lt;span style="color:red;"&gt;$1&lt;/span&gt;')</li><li> return m;</li><li> } );</li><li> // ELEMENT</li><li> sStr=sStr.replace(//&amp;lt/;/!ELEMENT[^&gt;&lt;]+(/&amp;gt/;|)/gi, function(m){</li><li> m=m.replace(/ ([^(?,*+)|]+) /gi,' &lt;span style="color:blue;"&gt;$1&lt;/span&gt; ');</li><li> m=m.replace(/(!ELEMENT)/gi,'&lt;span style="color:red;"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(//(([/s/S]+)/)/gi,function ($1){</li><li> return $1.replace(/([/S]+)/gi,'&lt;span style="color:fuchsia;"&gt;$1&lt;/span&gt;')</li><li> }</li><li> );</li><li> return m;</li><li> } );</li><li> // ATTLIST</li><li> sStr=sStr.replace(//&amp;lt/;/!ATTLIST[^&gt;&lt;]+(/&amp;gt/;|)/gi, function(m){</li><li> // &amp;lt;!ATTLIST title id CDATA #IMPLIED&amp;gt;</li><li> m=m.replace(/ ([^#]+)/g, ' &lt;span style="color:blue;"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(/([#][^&amp;]+)/g,'&lt;span style="color:fuchsia"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(/(!ATTLIST)/gi,'&lt;span style="color:red;"&gt;$1&lt;/span&gt;');</li><li> return m;</li><li> } );</li><li> // ATTLIST 1</li><li> sStr=sStr.replace(//&amp;lt/;/!ATTLIST[^&gt;&lt;]+(/&amp;gt/;|)/gi, function(m){</li><li> m=m.replace(/ ([^'!&lt;&gt;"" ]+)/gi,' &lt;span style="color:blue"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(//!(ATTLIST)/i,'!&lt;span style="color:red;"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(/([^=])(/'|/")([^/&lt;&gt; ]+)/2/g,'$1$2&lt;span style="color:fuchsia;"&gt;$3&lt;/span&gt;$2');</li><li> return m;</li><li> } );</li><li> // DOCTYPE</li><li> sStr=sStr.replace(//&amp;lt/;/!DOCTYPE[^&gt;&lt;]+(/&amp;gt/;|)/[/gi, function(m){</li><li> m=m.replace(/ (/S+) /gi,' &lt;span style="font-weight:bold"&gt;$1&lt;/span&gt; ');</li><li> m=m.replace(//!(DOCTYPE)/gi, '!&lt;span style="color:red"&gt;$1&lt;/span&gt;');</li><li> return m;</li><li> } );</li><li> // IGNORE</li><li> sStr=sStr.replace(//&amp;lt/;/!/[ (IGNORE|INCLUDE)[^&gt;&lt;]+(/]/]/&amp;gt/;|/&amp;gt/;|)/gi, function(m){</li><li> m=m.replace(/(/&amp;lt/;!/[) (IGNORE|INCLUDE)/,'$1 &lt;span style="font-weight:bold"&gt;$2&lt;/span&gt;');</li><li> m=m.replace(/([^!])/[([/S ]+)/]/,'$1[&lt;span style="color:fuchsia"&gt;$2&lt;/span&gt;]')</li><li> return m;</li><li> } );</li><li> // DOCTYPE 1</li><li> sStr=sStr.replace(//&amp;lt/;/!DOCTYPE[^&gt;&lt;]+(/&amp;gt/;|)/gi, function(m){</li><li> m=m.replace(/ ([^'!&lt;&gt;"" ]+)/gi,' &lt;span style="color:blue"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(//!(DOCTYPE)/i,'!&lt;span style="color:red;"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(/([^=])(/'|/")([^/&lt;&gt; ]+)/2/g,'$1$2&lt;span style="color:fuchsia;"&gt;$3&lt;/span&gt;$2');</li><li> return m;</li><li> } );</li><li> // NOTATION</li><li> sStr=sStr.replace(//&amp;lt/;/!NOTATION[^&gt;&lt;]+(/&amp;gt/;|)/gi, function(m){</li><li> m=m.replace(/ ([^'!&lt;&gt;"" ]+)/gi,' &lt;span style="color:blue"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(//!(NOTATION)/i,'!&lt;span style="color:red;"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(/([^=])(/'|/")([^/&lt;&gt; ]+)/2/g,'$1$2&lt;span style="color:fuchsia;"&gt;$3&lt;/span&gt;$2');</li><li> return m;</li><li> } );</li><li> // ENTYT(Y|IES)</li><li> sStr=sStr.replace(//&amp;lt/;/!ENTIT(Y|IES)[^&gt;&lt;]+(/&amp;gt/;|)/gi, function(m){</li><li> m=m.replace(/ ([^'!&lt;&gt;"" ]+)/gi,' &lt;span style="color:blue"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(//!(ENTIT(Y|IES))/i,'!&lt;span style="color:red;"&gt;$1&lt;/span&gt;');</li><li> m=m.replace(/([^=])(/'|/")([^/&lt;&gt; ]+)/2/g,'$1$2&lt;span style="color:fuchsia;"&gt;$3&lt;/span&gt;$2');</li><li> return m;</li><li> } );</li><li> // &lt;/markup/&gt;</li><li> sStr=sStr.replace(//&amp;lt/;(//|)[a-z0-9_/-:]+(/&amp;gt/;| ///&amp;gt/;|///&amp;gt/;)/gi, function(m){</li><li> m=m.replace(/(/&amp;lt/;(//|))([a-z0-9_/-:]+)/gi,'$1&lt;span style="color:red;"&gt;$3&lt;/span&gt;');</li><li> return m;</li><li> } );</li><li> // &lt;markup pram='value'/&gt;</li><li> sStr=sStr.replace(/&amp;lt;[^&lt;&gt;]+/=[^&gt;&lt;]+(///&amp;gt/;|/&amp;gt/;|)/gi, function(m){</li><li> m=m.replace(/([a-z:]+)( |)/=/gi,'&lt;span style="color:blue;"&gt;$1&lt;/span&gt;$2###=###');</li><li> m=m.replace(/[#]{3}/=[#]{3}(/'|")([^&lt;&gt;'"]+)/g,</li><li> '=$1&lt;span style="color:fuchsia;"&gt;$2&lt;/span&gt;');</li><li> m=m.replace(//#{3}/=/#{3}/g,'=');</li><li> m=m.replace(/(/&amp;lt/;)([^&lt;&gt;]+)/,'$1&lt;span style="color:red;"&gt;$2&lt;/span&gt;');</li><li> return m;</li><li> } );</li><li> }</li><li> //------------------------------end xml</li><li> return sStr;</li><li> }</li><li> }</li><li> //-------------------------end function fHighlight(sStr, sOpt)-------------------------//</li><li> οnlοad=function(){</li><li> document.body.innerHTML=fHighlight(document.body.innerHTML, 'javascript xml');</li><li> }</li><li>//]]&gt;</li><li>&lt;/script&gt;</li><li> </li></ol></pre> </div>
  179. </body>
  180. </html>
  181.  

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值