• 欢迎访问搞代码网站,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站!
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏搞代码吧

SyntaxHighlighter 3.0.83 的使用_js

JavaScript 程序员 3年前 (2018-06-21) 162次浏览 已收录 0个评论

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

官方下载地址:http://alexgorbatchev.com/SyntaxHighlighter/download/

因为使用SyntaxHighlighter的时候会使用到多种语言,一次必载入全部的语言配置文件下载的东西会比较多,所以SyntaxHighlighter 3.0 开始提供了一个shAutoloader.js脚本。它让浏览器按照当前页面內容去载入相对应语言的上色系统,这对载入速度是一大改善! 下面是 admin10000.com 给出的代码

1、在网页头部加载核心JS和样式文件

 <link type="text/css" rel="stylesheet" href="/SyntaxHighlighter/styles/shCore.css" /> <link type="text/css" rel="stylesheet" href="/SyntaxHighlighter/styles/shThemeDefault.css" />   <script type="text/javascript" src="/SyntaxHighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/SyntaxHighlighter/scripts/shAutoloader.js"></script> 

2、执行SyntaxHighlighter.autoloader。

autoloader必须在页面完成载入后再去执行它。如果引用了jquery,可以放$(document).ready()里,就能看到效果了。

 <script type="text/javascript"> function path() {     var args = arguments,     result = [];     for(var i = 0; i < args.length; i++)         result.push(args[i].replace('@', '/SyntaxHighlighter/scripts/'));     return result }; $(document).ready(function(){     SyntaxHighlighter.autoloader.apply(null, path(     'applescript            @shBrushAppleScript.js',     'actionscript3 as3      @shBrushAS3.js',      'bash shell             @shBrushBash.js',      'coldfusion cf          @shBrushColdFusion.js',     'cpp c                  @shBrushCpp.js',     'c# c-sharp csharp      @shBrushCSharp.js',      'css                    @shBrushCss.js',      'delphi pascal          @shBrushDelphi.js',      'diff patch pas         @shBrushDiff.js',      'erl erlang             @shBrushErlang.js',     'groovy                 @shBrushGroovy.js',      'java                   @shBrushJava.js',     'jfx javafx             @shBrushJavaFX.js',      'js jscript javascript  @shBrushJScript.js',     'perl pl                @shBrushPerl.js',     'php                    @shBrushPhp.js',      'text plain             @shBrushPlain.js',      'py python              @shBrushPython.js',     'ruby rails ror rb      @shBrushRuby.js',     'sass scss              @shBrushSass.js',     'scala                  @shBrushScala.js',     'sql                    @shBrushSql.js',      'vb vbnet               @shBrushVb.js',     'xml xhtml xslt html    @shBrushXml.js'     ));     SyntaxHighlighter.defaults['smart-tabs'] = true;     SyntaxHighlighter.defaults['tab-size'] = 4;     SyntaxHighlighter.all(); }); </script>

相关文档:FckEditor(CKEditor)配置详细教程

欢迎大家阅读《SyntaxHighlighter 3.0.83 的使用_js》,跪求各位点评,若觉得好的话请收藏本文,by 搞代码


喜欢 (0)
[搞代码]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址