HTML代码如下:
<html>
<head>
<title>JS Minifier</title>
<script type="text/javascript">
String.prototype.has=function(c){return this.indexOf(c)>-1;};function jsmin(comment,input,level){if(input===undefined){input=comment;comment='';level=2;}else if(level===undefined||level<1||level>3){level=2;}if(comment.length>0){comment+='\n';}var a='',b='',EOF=-1,LETTERS='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz',DIGITS='0123456789',ALNUM=LETTERS+DIGITS+'_$\\',theLookahead=EOF;function isAlphanum(c){return c!=EOF&&(ALNUM.has(c)||c.charCodeAt(0)>126);}function get(){var c=theLookahead;if(get.i==get.l){return EOF;}theLookahead=EOF;if(c==EOF){c=input.charAt(get.i);++get.i;}if(c>=' '||c=='\n'){return c;}if(c=='\r'){return'\n';}return' ';}get.i=0;get.l=input.length;function peek(){theLookahead=get();return theLookahead;}function next(){var c=get();if(c=='/'){switch(peek()){case'/':for(;;){c=get();if(c<='\n'){return c;}}break;case'*':get();for(;;){switch(get()){case'*':if(peek()=='/'){get();return' ';}break;case EOF:throw'Error: Unterminated comment.';}}break;default:return c;}}return c;}function action(d){var r=[];if(d==1){r.push(a);}if(d<3){a=b;if(a=='\''||a=='"'){for(;;){r.push(a);a=get();if(a==b){break;}if(a<='\n'){throw'Error: unterminated string literal: '+a;}if(a=='\\'){r.push(a);a=get();}}}}b=next();if(b=='/'&&'(,=:[!&|'.has(a)){r.push(a);r.push(b);for(;;){a=get();if(a=='/'){break;}else if(a=='\\'){r.push(a);a=get();}else if(a<='\n'){throw'Error: unterminated Regular Expression literal';}r.push(a);}b=next();}return r.join('');}function m(){var r=[];a='\n';r.push(action(3));while(a!=EOF){switch(a){case' ':if(isAlphanum(b)){r.push(action(1));}else{r.push(action(2));}break;case'\n':switch(b){case'{':case'[':case'(':case'+':case'-':r.push(action(1));break;case' ':r.push(action(3));break;default:if(isAlphanum(b)){r.push(action(1));}else{if(level==1&&b!='\n'){r.push(action(1));}else{r.push(action(2));}}}break;default:switch(b){case' ':if(isAlphanum(a)){r.push(action(1));break;}r.push(action(3));break;case'\n':if(level==1&&a!='\n'){r.push(action(1));}else{switch(a){case'}':case']':case')':case'+':case'-':case'"':case'\'':if(level==3){r.push(action(3));}else{r.push(action(1));}break;default:if(isAlphanum(a)){r.push(action(1));}else{r.push(action(3));}}}break;default:r.push(action(1));break;}}}return r.join('');}jsmin.oldSize=input.length;ret=m(input);jsmin.newSize=ret.length;return comment+ret;}
function $(i) {return document.getElementById(i);}
function go() {
$('output').value = jsmin($('comment').value, $('input').value, $('level').value);
$('outputtitle').style.display = $('output').style.display = $('statstitle').style.display = $('stats').style.display = 'block';
$('oldsize').value = jsmin.oldSize;
$('newsize').value = jsmin.newSize;
$('ratio').value = (Math.round(jsmin.newSize / jsmin.oldSize * 1000) / 10) + '%';
}
function bw() {
$('comment').value = $('input').value = $('output').value = '';
$('outputtitle').style.display = $('output').style.display = $('statstitle').style.display = $('stats').style.display = 'none';
}
</script>
<style type="text/css">
#comment { width:95%; height:4em; }
#input { width:95%; height:10em; }
#go { font-weight:bold; }
#outputtitle, #statstitle, #stats { display:none; }
#oldsize, #newsize, #ratio { text-align:right; width:4em; }
#output { width:95%; height:10em;display:none; }
h2 { margin-bottom:0; }
</style>
</head>
<body bgcolor="linen">
<h1>JS Minifier</h1>
<p>By Franck Marcia,
From the <a href="
http://javascript.crockford.com/jsmin.html" target="_blank">original idea</a> of <a href="
http://www.crockford.com/" target="_blank">Douglas Crockford</a>,
Last modified: 2006/08/31</p>
<hr/>
<h2>Comments</h2>
<textarea id="comment" name="comment"></textarea>
<h2>Code</h2>
<textarea id="input" name="input"></textarea>
<center>
Level:
<select id="level">
<option value="1">minimal</option>
<option value="2" selected="selected">conservative</option>
<option value="3">agressive</option>
</select>
<input id="go" type="submit" value="JSMin" onclick="go();return false;"/>
<input type="submit" value="Clear" onclick="bw();return false;"/>
<small><b>Minimal</b>: original algorithm but keep linefeeds if single - <b>Conservative</b>: original algorithm - <b>Agressive</b>: remove more linefeed than the original algorithm but can be regressive</small>
</center>
<h2 id="outputtitle">Output</h2>
<textarea id="output" name="output"></textarea>
<h2 id="statstitle">Stats</h2>
<div id="stats">Old size: <input id="oldsize"></span> New size: <input id="newsize"></span> Ratio: <input id="ratio"></span></div>
</body>
</html>