Syntax Highlighter （コードの色分け表示）
<script type="text/javascript" src="SOMEWHERE/jquery.pack.js"></script>
<script type="text/javaScript" src="SOMEWHERE/chili.pack.js"></script>
<script type="text/javascript">
ChiliBook.recipeFolder = "SOMEWHERE/";
ChiliBook.stylesheetFolder = "SOMEWHERE/";
</script>
ChiliBook = { //implied global
version: "1.9" // 2007-09-24
, automatic: true
, automaticSelector: "pre" //code
, codeLanguage: function( el ) {
var recipeName = $( el ).attr( "class" );
return recipeName ? recipeName : '';
}
, stylesheetLoading: false
, stylesheetFolder: "" // used like: stylesheetFolder + recipeName + '.css'
, recipes: {} //repository
, preElement: null
};
$.metaobjects = function( options ) {
options = $.extend( {
context: document
, clean: true
, selector: 'object.metaobject'
}, options );
function jsValue( value ) {
eval( 'value = ' + value + ";" );
return value;
}
return $( options.selector, options.context )
.each( function() {
var settings = { target: this.parentNode };
$( '> param[@name=metaparam]', this )
.each( function() {
$.extend( settings, jsValue( this.value ) );
} );
$( '> param', this )
.not( '[@name=metaparam]' )
.each( function() {
var name = this.name, value = jsValue( this.value );
$( settings.target )
.each( function() {
this[ name ] = value;
} );
} );
if( options.clean ) {
$( this ).remove();
}
} );
};
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja-JP" xml:lang="ja-JP"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>_TITLE_ </title> <link rel="stylesheet" href="../style/style.css" type="text/css" /> <script type="text/javascript" src="../common.js" charset="UTF-8"></script> </head> <body> <h1> <a href="">_TITLE_</a> </h1>
/* HTML */
span.php { color: red; font-weight: bold; }
span.tag { color: navy; font-weight: bold; }
span.aname { color: purple; }
span.avalue { color: fuchsia; }
span.mlcom { color: green; }
span.entity { color: teal; }
/* JavaScript */
span.mlcom { color: #4040c2; }
span.com { color: green; }
span.regexp { color: maroon; }
span.string { color: teal; }
span.keywords { color: navy; font-weight: bold; }
span.global { color: blue; }
span.numbers { color: red; }
/*CSS*/
span.mlcom { color: #4040c2; }
span.color { color: green; }
span.string { color: teal; }
span.attrib { color: navy; font-weight: bold; }
span.value { color: blue; }
span.number { color: red; }