dzLib.js
 

Color syntax javascript-code

Description:
This library makes your source look more attractive when published as HTML. It can either be used client-side or server-side. Also try the bracket-matching function: move your mouse-cursor over a bracket in the syntax-colored source below. This lib produces xHTML. Colors can be fully configured via CSS-classes.

Download: code, view-source, CSS.
Targetted: ie4+, ns6.1+
Tested on: win32: ie5..ie6, ns6.1

Usage:

 
//Divide operator now works
var a = 20;
var b = a / 100;
var c = "b";

//Server-side (no Server.HTMLEncode needed!)
Response.Write(parseJSCode(strJavascript,false)); 

//Client-side (including line-numbers)
document.getElementById('divCode').innerHTML=parseJSCode(strJavascript,true);

//Highlight all PRE tags with CLASS "JS" and CLASS "JSnr" with linenumbers
hiLiteJS('JS');
hiLiteJS('JSnr',true):

//Regular expressions and numbers also work
var re=[/^0x[0-9a-f]$/i, /^#(.*?)$/gm, /function(\s*[a-z_$][a-z0-9_$}*){0,1}\(.*?\)/i];
var nHex=[0xF, 0Xff80, 0xF8D7];
var nWholeNumbers=[0, 12, 20, 142323, 12., +12, -13];
var nFractions=[.12, 0.312, 0.1434241];
var nExponents=[12e132, 1E+12, 10e-12, 10.12e2];]]>
  

Demo




HTML preview:

(select all, CSS).

History

  • 31-03-2003: fixed difference between regular expressions and divisions (bug submitted by Owen van Dijk, thanks).
  • 20-09-2002: added support for number- and regular expression literals
  • 19-09-2002: fixed a bugs: line-remark on Mac

Planned options

  • Fix code to work under Safari
  • Operator recognition (+, -, ==, new, typeof etc.)
  • Correct identifier-parsing (now, a token is a word, consisting of alpha-characters)