jQuery语法高亮插件支持各种程序源代码语法着色加亮

1) highlightjs

Highlight.js能够对页面中的各种程序源代码语法着色加亮。支持的语言包括:

•Python
•Ruby
•Perl
•PHP
•XML
•HTML
•CSS
•Django
•Javascript
•VBScript
•Delphi
•Java
•C++
•RenderMan (RSL and RIB)
•SQL
•SmallTalk
•Axapta
•1C
•Ini
•Diff
•DOS .bat
•Bash

2) google-code-prettify

Google Code Prettify是一个JavaScript库,用来对各种页面上的源码进行语法着色高亮显示。Google Code Prettify很小巧,解压后也只有85K的大小。支持大部分常用的语言。不需要指定语言。

3) SyntaxHighlighter

SyntaxHighlighter,是一款用于web页面的代码着色工具,可以用来着色多种语言,可以是 HTML,CSS,Javascript,还可以是C,JAVA等编程语言。最早见于Yahoo的YUI,当时还属于自由软件,最近打开官方网站发现已被 goolge收编。

它可以在网页中对各种程序源代码语法进行加亮显示。支持当前流行的各种编程语言:C#、CSS、C++、Delphi、Java、JavaScript、PHP、Python、Ruby、SQL、Visual Basic、XML / HTML。

4) Chili – jQuery Plugin

Chili是jQuery代码高亮插件。

5) pygments

Pygments是一个实现的格式化高亮代码的Python库。包含四个模块:

  1. lexer - 将代码解析成token流,每个一token都包含两个属性,一个是当前token的类型,一个是当前token的值。Pygments支持的语言很多,具体可以参考附录A。
  2. filters - 通过lexer解析出来的token流送入filter,可以根据条件修改某些token的属性或者值。
  3. formatter - token流最终输出是根据formater的定义,输出成实现定义好的格式,例如HTML, LaTex或者RTF。
  4. style - 定义了输出的风格,例如不同类型的token按照不同的颜色显示,或者是否粗体。

6) ultraviolet

Ultraviolet是一个基于Textpow的语法高亮引擎、Ultraviolet同时也是一个独立的命令行实用程序和Ruby库。

7) GESHi

GeSHi(Generic Syntax Highlighter)用于在HTML页面中高亮显示各种源代码。支持超过60种语言:PHP、HTML、C、Java、Java5、C#、 Actionscript、Delphi、C++、Groovy、Javascript、Perl、PL/SQL、Ruby、Python、SQL、 XML等,并易于集成到Dokuwiki,Mambo,phpBB,WordPress和WikkaWiki等系统中使用。

8) snippet

Snippet是一个很酷的jQuery语法高亮插件,基于SHJS脚本,你可以在SourceForge上找到源码。Snippet提供了简单而且快捷的方法,可以方便的为你带来高亮语法的提示.可以在IE 6, IE 7, IE 8, FF 3.6, Chrome 6.0, Safari 5.0, Opera 10.62中运行.

(0)

相关推荐

  • jQuery编辑器KindEditor4.1.4代码高亮显示设置教程

    编辑器KindEditor官网: http://www.kindsoft.net/ 1.需要加载的JS和CSS文件为: 复制代码 代码如下: <script src="kindeditor-4.1.4/kindeditor.js" type="text/javascript" charset="utf-8"></script> <script src="kindeditor-4.1.4/plugins/co

  • jQuery实现当前页面标签高亮显示的方法

    本文实例讲述了jQuery实现当前页面标签高亮显示的方法.分享给大家供大家参考.具体实现方法如下: function nav(name, csskey,cssvalue) { var url = window.location.pathname + window.location.search; var v1 = ""; $(name).each(function () { v1 = "/" + $(this).attr("href"); if

  • jQuery Json数据格式排版高亮插件json-viewer.js使用方法详解

    jQuery Json数据格式排版高亮插件json-viewer.js使用方法详解 1.插件介绍: jquery.json-viewer.js是一款查看json格式数据的jquery插件.它可以将混乱的json数据漂亮的方式展示在页面中,并支持节点的伸展和收缩和语法高亮等功能. 2.代码演示: 1).首先引入jquery和json.viewer.js插件 <script src="http://www.jq22.com/jquery/jquery-1.10.2.js">&l

  • jquery实现页面关键词高亮显示的方法

    本文实例讲述了jquery实现页面关键词高亮显示的方法.分享给大家供大家参考.具体分析如下: 通过jquery对页面搜索关键词进行高亮显示 支持中文多词页面中高亮显示 1. JavaScript代码如下: 复制代码 代码如下: jQuery.fn.extend({     highlight: function(search, configs){         if(typeof(search) == 'undefined') return;         var configs =  jQ

  • Jquery 高亮显示文本中重要的关键字

    一.界面预览 鼠标放到右边的Tab按钮上,文字透明度降低,同时一段文字高亮显示,效果如下: Demo地址:http://5thirtyone.com/sandbox/samples/fadefocus/ 很绚丽的效果幺! 二.实现原理 将要高亮显示的文字加上<span>段落标记, class="mask"的div 做为遮罩层,使此遮罩层位于文字内容之上(z-index属性,使用Jquery给段落动态添加样式类.三.HTML代码 复制代码 代码如下: <div clas

  • 基于jquery实现导航菜单高亮显示(两种方法)

    项目需求: 实现原理:当选中当前元素时,给当前元素添加样式,同级元素移除样式. 点击不同的导航菜单实现当前点击的菜单是高亮的,点击导航下面的某个分类,分类所属的导航也必须是高亮的,点击某一篇文章,文章所属的导航菜单也必须是高亮的. 效果图如下: 示例代码一: 具体示例代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/x

  • jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果

    本文实例讲述了jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果.分享给大家供大家参考.具体如下: 这是一款jquery菜单特效,点击后高亮背景,个性的菜单特效.网上见到比较多的菜单了,不过像这样这么简单的方法来实现却不多见,本菜单整体简洁,点击导航栏上的任意菜单项后,该菜单项的背景变成黑色,并且鼠标移走后,仍然固定保持黑色,记住了菜单的位置. 运行效果如下图所示: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-menu-set-focus-

  • jquery实现带复选框的表格行选中删除时高亮显示

    通过jquery技术来操作表格是件简单的事,通过jquery的语法,可以很轻松的完成表格的隔行换色,悬浮高亮,在实际的应用中可能会出现表格中带复选框的,删除时,将复选框所在的行的记录删除.在这的地方,可以加个特效,单击某行的同时将该行的复选框选中,该行的背景色也高亮显示.这样给人的感觉非常好. 效果如下:  我做的这里有两个功能: 功能1.单击某行,该行的复选框被选中,同时改变一下背景色. 功能2.单击全选/全不选标签后,改变行的颜色. 两个功能我封装到了js文件中,使用的时候引入就行了. 先看

  • jquery(1.3.2) 高亮选中图片边框

    因为需要加载文件,建议刷新下 高亮选中图片边框 #mainboard img{ border:1px solid #cccccc; width:88px; height:31px; cursor:pointer; } $(function(){ $("#mainboard img").bind("click",function(){ $(this).css("border","1px solid red").siblings(

  • JQuery操作表格(隔行着色,高亮显示,筛选数据)

    查了些资料,写了4个Demo: 1. 隔行着色 复制代码 代码如下: $('#table1 tr:odd').addClass('odd'); $('#table1 tr:even').addClass('even'); 效果: 2. 高亮含有特定数据的行 复制代码 代码如下: $("#table2 tr:contains('Fuck')").addClass("selected"); 3. 筛选数据 复制代码 代码如下: $("#filter"

随机推荐