1.简介 introduction

  Google Code Pretiffy 是 Google 的一个用来对代码进行语法着色的 JavaScript 库,支持 C/C++, Java, Python, Ruby, PHP, VisualBasic, AWK, Bash, SQL, HTML, XML, CSS, JavaScript, Makefiles和部分Perl。

  code.google.com、stackoverflow.com、api.jquery.com等知名网站都在使用它。

2.官方示例 DEMO

  见http://google-code-prettify.googlecode.com/svn/trunk/tests/prettify_test.html

  如下图所示,为在网页上进行c语言代码着色后的效果:

3.特点 features list

工作基于前台页面
即使代码中包含行号、链接等等,也可运行。
简单的API :只需加载一点JS和CSS,以及添加一个onLoad事件。
轻量级:绝对的小体积并不会阻碍加载页面。 可通过CSS定制样式。
通过CSS定制的样式。主题库
支持所有的C类语言,Bash类语言,XML类语言。无需指定语言。
其它可扩展语言,你可以通过指定语言来支持。
良好的跨浏览器支持。

  

4.安装方法 installation

1、在你的网页上加载JS和CSS文件

<link href="prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="prettify.js"></script>

  

2、然后在html 的body标签中添加一个onload事件 onload=”prettyPrint()”

如果你加载了JQuery,则可以添加以下代码

$(document).ready(function(){
prettyPrint();
})  

到这里,你的google-code-prettify基本可以工作了。

5.使用方法 usage

你只需要把代码放进

<pre>...</pre> 或者 <code>...</code>  

就可以实行代码高亮了。

无需你指定哪种语言就可以工作了。当然,你也可以指定一种语言,

<pre class=”prettyprint Language”>,  

language 改为以下的一种语言:“bash”, “c”, “cc”, “cpp”, “cs”, “csh”, “cyc”, “cv”, “htm”, “html”, ”java”, “js”, “m”, “mxml”, “perl”, “pl”, “pm”, “py”, “rb”, “sh”, ”xhtml”, “xml”, “xsl”。

 

6.参考 reference

1.google-code-prettify使用手册:http://google-code-prettify.googlecode.com/svn/trunk/README.html

2.google-code-prettify主页:http://code.google.com/p/google-code-prettify/

3.http://www.hujuntao.com/web/javascript/google-code-pretiffy-lightweight-code-highlighting-plugin.html

Google Code Pretiffy 代码 着色 高亮 开源 javascript(JS)库的更多相关文章

  1. freshcodecolor纯正则实现的在线代码着色(高亮)

    小菜最新完成的一款在线代码着色工具-freshcodecolor,该工具采用Javascript编写,着色识别策略完全采用正则表达式,无奈正则表达式在Javascript中有很大局限性,导致某些场合识 ...

  2. Google Code项目代码托管网站上Git版本控制系统使用简明教程

    作为一个著名的在线项目代码托管网站,Google Code目前主要支持三种版本控制系统,分别为Git, Mercurial和 Subversion.Subversion即SVN相信大家都已经熟知了,这 ...

  3. 微软MVC框架实战:开源的JS库Knockout

    [IT168 技术] Knowckout – 当MVC遭遇MVVM Knockout (或者Knockout.js ,KnockoutJS)是一个开源的JavaScript库,网址为www.knock ...

  4. 最新开源JavaScript 图表库 ECharts推荐

    ECharts是一款由百度前端技术部开发的,基于Javascript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表. ECharts 提供大量常用的数据可视化图表,底层基于Z ...

  5. 使用 Google Code Prettify 实现代码高亮

    今天这篇文章主要讲述使用 google-code-prettify 来实现代码的高亮显示,以前我使用 highlight.js 来实现文章中代码的高亮显示. prettify 非常小巧且配置简单,使用 ...

  6. 五、Google Code Prettify:实现代码高亮的JS库

    介绍 code prettify 解释为 “代码修饰”. 他由JS代码和CSS代码构成,用来高亮显示HTML页面中的代码. 支持:C, Java, Python, Bash, HTML, XML, J ...

  7. svn import 向Google code里导入初始代码

    其实很简单的问题,花费了这么多时间,想把初始代码导入到Google code里,用VisaulSVN插件的Switch功能也不可以,Google code上虽然有上传,但是只能单个文件传...... ...

  8. ECLIPSE使用HG插件去上载 GOOGLE.CODE下的代码

    ECLIPSE使用HG插件去上载 GOOGLE.CODE下的代码 www.MyException.Cn   发布于:2012-09-10 22:20:12   浏览:112次 0   ECLIPSE使 ...

  9. [开源]Google code Android开源项目(一)

    [Android分享] [开源]Google code Android开源项目(一) [复制链接]     449122717 2 主题 2 好友 816 积分 No.4 中级开发者 升级  19.3 ...

随机推荐

  1. MJRefresh插件引起的错误

    添加的头部或者尾部刷新,离开这个界面的时候需要移除 - (void)dealloc {    [_tableView removeHeader];} 不同版本的处理的方式不同 报的错误: 类的一个实例 ...

  2. Linux的别名使用

    直接定义别名 编辑当前用户下的.bashrc 文件: vim  ~/.bashrc 添加别名为 lmysql 的命令语句 : alias lmysql='mysql -uroot -p -Dtest ...

  3. **apache环境下 禁止显示 index of/ 目录下(如何禁止访问网站根目录)

    比如: http://123.57.49.XX6// 当这样访问的时候,可能会列出网站的根目录 如何禁止列出网站目录,方法如下: 让别人知道你的网站目录结构直接查看你目录下的所有文件是很危险的一个事情 ...

  4. 递推DP HDOJ 5328 Problem Killer

    题目传送门 /* 递推DP: 如果a, b, c是等差数列,且b, c, d是等差数列,那么a, b, c, d是等差数列,等比数列同理 判断ai-2, ai-1, ai是否是等差(比)数列,能在O( ...

  5. hadoop 1 testcase运行方法

       转入hadoop2.0后,逐渐忘记了之前做testcase运行的方法,记录一下:    ant -Dtestcase=Test***    如果只运行core包得testcase可以    an ...

  6. scp 传文件

    1. 从远程服务器上拷贝文件(指定远程服务器的用户名:IP:文件    本地文件名) scp root@121.43.16.131:/etc/supervisor/supervisord.conf ~ ...

  7. QTableWidget使用简单,因为不再存在父节点的关系

    虽然使用比较简单,但亲自过一遍还是有必要的,权当一个学习笔记吧,记录在此. #include "tablewidgetxxx.h" #include <QtGui/QAppl ...

  8. IE8 浏览器自动保存文档副本,添加缓存

    若响应(response)HTTP头信息中没有关于缓存的头信息,则在IE8中第二次请求网页时,从缓存中拿取文件,而不是重新向服务器请求.而在Firefox或chrome则是重新向服务器请求. 解决方法 ...

  9. 常用WinPE

    微PE工具箱:http://www.wepe.com.cn/ 绝对PE工具箱:http://dl.pconline.com.cn/download/64736.html 通用PE工具箱:http:// ...

  10. Alpha、 Beta、build、release测试

    alpha(内测) alpha测试是由一个用户在开发环境下进行的测试,也可以是公司内部的用户在模拟实际操作环境下进行的测试.alpha测试的目的是评价软件产品的FLURPS(即功能.局域化.可使用性. ...