仿服務(wù)器端腳本方式的JS模板實現(xiàn)方法
更新時間：2007年04月27日 00:00:00 作者：
http://bbs.51js.com/thread-65160-1-1.html
<html xmlns="http://www.w3.org/1999/xht...
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>jssp演示</title>
<script language="javascript">
/**
* @description:
* 使用javascript模仿JSP的頁面解析和運行，運行于客戶端
* 允許應(yīng)用人員象開發(fā)JSP頁面一樣使用<%..%>
* 允許頁面動態(tài)包括子頁面（同步讀取頁面）
*
**/
//@--------------------------------------------------------------------- JSSP聲明
var jssp=function(){};
/**
* 頁面緩存管理實例對象
*/
jssp.cacheInstance=null;
/**
* 頁面加載實例對象
*/
jssp.pageLoaderInstance=null;
/**
* 在指定dom插入pagePath的執(zhí)行后的頁面內(nèi)容
*/
jssp.render=function(pagePath,dom){
if(typeof dom=="string") dom=document.getElementById(dom);
var content=jssp.Core.run(pagePath);
dom.innerHTML=content;
}
//@------------------------------------------------------------------------ JSSP運行配置
/**
* 引擎運行全局配置
*/
jssp.Config={};
/**
* 如果在客戶端運行，是否緩存解析的頁面
*/
jssp.Config.cachable=true;
/**
* 當(dāng)jssp.Config.cacheable為true且在
*/
jssp.Config.cacheClass="jssp.Cache.DefaultCache";
/**
* 頁面內(nèi)容讀取器
*/
jssp.Config.pageLoaderClass="jssp.Core.PageLoader.Ajax";
//@------------------------------------------------------------------------ JSSP頁面緩存類
/**
* 頁面緩存類
*/
jssp.Cache=function(){}
/**
* 設(shè)置緩存
*/
jssp.Cache.prototype.set=function(key,cache){}
/**
* 得到緩存
*/
jssp.Cache.prototype.get=function(key){}
/**
* 默認的緩存實現(xiàn)類
*/
jssp.Cache.DefaultCache=function(){
this.caches={};
}
jssp.Cache.DefaultCache.prototype.set=function(key,cache){
this.caches[key]=cache;
}
jssp.Cache.DefaultCache.prototype.get=function(key){
return this.caches[key];
}
//@----------------------------------------------------------------------- JSSP運行上下文類
/**
* jssp頁面的執(zhí)行上下文對象
* @member params 請求參數(shù)數(shù)組
* @member cookies 操作cookies對象 jssp.Cookies
* @member out 頁面流輸出對象 jssp.Out
* @method setAttribute 設(shè)置上下文參數(shù)
* @method getAttribute 得到上下文參數(shù)
* @method removeAttribute 刪除上下文參數(shù)
* @method include 動態(tài)包含子頁面
* @method getCookies,getParameter,getParameters,getOut
* @param pageUrl 運行的上下文參數(shù)
* @param context 父頁面的上下文對象
*/
jssp.Context=function(pageUrl,context){
this.params=this._resolveParam(pageUrl);
if(!context){
this.cookies=jssp.Cookies;
this.out=new jssp.Out();
this.attributes=[];
}else{
this.context=context;
this.isIncluded=true;
}
}
/**
* 解析頁面后綴參數(shù)
*/
jssp.Context.prototype._resolveParam=function(pageUrl){
var i1=pageUrl.indexOf("?");
if(i1<=0) return [];
pageUrl=pageUrl.substring(i1+1);
var s1=pageUrl.split("&");
var params=[];
for(var i=0;i<s1.length;i++){
var s2=s1[i].split("=");
var key=s2[0];var value=s2[1];
var ps=params[key];
if(!ps) ps=[];
ps[ps.length]=value;
params[key]=ps;
}
return params;
}
/**
* 設(shè)置參數(shù)值
*/
jssp.Context.prototype.setAttribute=function(key,value){
if(!this.context)
this.attributes[key]=value;
else
this.context.setAttribute(key,value);
}
/**
* 得到參數(shù)值
*/
jssp.Context.prototype.getAttribute=function(key){
if(!this.context)
return this.attributes[key];
else
return this.context.getAttribute(key);
}
/**
* 刪除指定鍵的參數(shù)值
*/
jssp.Context.prototype.removeAttribute=function(key){
if(!this.context)
this.attributes[key]=undefined;
else
this.context.removeAttribute(key);
}
/**
* 得到請求參數(shù)值
*/
jssp.Context.prototype.getParameter=function(key){
var ps=this.params[key];
if(!ps) return this.context?this.context.getParameter(key):undefined;
return ps.join(",");
}
/**
* 得到有重復(fù)參數(shù)的值
*/
jssp.Context.prototype.getParameters=function(key){
var pss=this.params[key];
if(!pss) pss=this.context?this.context.getParameters(key):undefined;
return pss;
}
/**
* 得到cookies對象
*/
jssp.Context.prototype.getCookies=function(){
if(!this.context)
return this.cookies;
else
return this.context.getCookies();
}
/**
* 得到輸出流OUT對象
*/
jssp.Context.prototype.getOut=function(){
if(!this.context)
return this.out;
else
return this.context.getOut();
}
/**
* 動態(tài)包含子頁面
*/
jssp.Context.prototype.include=function(childPageUrl){
this.getOut().print(jssp.Core.run(childPageUrl,this));
}
jssp.Context.prototype.isIncluded=false;//判斷當(dāng)前頁面是否被包含的
//@-----------------------------------------------------------------------JSSP運行cookies操作類
/**
* 簡單操縱cookies方法
*/
jssp.Cookies=function(){}
/**
* 設(shè)置cookie項
*/
jssp.Cookies.set=function(key,value){
document.cookie=key+"="+escape(value)+";";
}
/**
* 得到cookie項
*/
jssp.Cookies.get=function(key){
var aCookie=document.cookie.split("; ");
for(var i=0;i<aCookie.length;i++){
var aCrumb=aCookie[i].split("=");
if(key==aCrumb[0])
return unescape(aCrumb[1]);
}
}
/**
* 刪除cookies項
*/
jssp.Cookies.remove=function(key){
document.cookie=key+"=null; expires=Fri, 31 Dec 1999 23:59:59 GMT;";
}
//@------------------------------------------------------------------------ JSSP頁面運行輸出流類
/**
* 頁面流輸出對象
*/
jssp.Out=function(){
this.datas=[];//數(shù)據(jù)流片斷
this._index=0;
}
/**
* 把頁面流片斷放入緩沖區(qū)
*/
jssp.Out.prototype.print=function(s){
this.datas[this._index++]=s;
}
/**
* 輸出緩沖區(qū)里的數(shù)據(jù)
*/
jssp.Out.prototype.flush=function(){
var data=this.datas.join("");
this.datas=[];this._index=0;
return data;
}
//@--------------------------------------------------------------------------JSSP頁面核心類聲明
jssp.Core=function(){}
//@--------------------------------------------------------------------------JSSP頁面解析實現(xiàn)類
/**
* 頁面解析
* @param pageContent JSSP頁面內(nèi)容
*/
jssp.Core.parse=function(pageContent){
var strBuffer=[];//解析后文本存放的緩沖區(qū)
var point=0;//緩沖區(qū)指針
var lineNumber=1;//解析的當(dāng)前行
try{
var betweenPerc=false;
var isPrint=false;
strBuffer[point++]="function($context){\n";
strBuffer[point++]="var $out=$context.getOut();\n";
strBuffer[point++]="var $cookies=$context.getCookies();\n";
strBuffer[point++]="try{\n";
strBuffer[point++]="$out.print(unescape('";
var line="";
var value=pageContent;
var len=value.length;
for(var i=0;i<len;i++){
var nextTwo="";
if(i<=len-2) nextTwo=value.charAt(i)+value.charAt(i+1);
var nextThree="";
if(i<=len-3) nextThree=nextTwo+value.charAt(i+2);
if(nextTwo=="<%"&&nextThree!="<%="&&nextThree!="<%@"){
strBuffer[point++]="'));\n";
betweenPerc=true;
i+=1;
}else if(nextTwo=="<%"&&nextThree=="<%="&&nextThree!="<%@"){
strBuffer[point++]=escape(line)+"'));\n";
line="";
strBuffer[point++]=" $out.print( ";
betweenPerc=true;
isPrint=true;
i+=2;
}else if(nextTwo=="<%"&&nextThree!="<%="&&nextThree=="<%@"){
i+=3;
var directive="";
while(nextTwo!="%>"){
directive+=value.charAt(i);
i++;
if(i<=value.length-2){
nextTwo=value.charAt(i)+value.charAt(i+1);
}
}
strBuffer[point++]=escape(line)+"'));\n";
line="";
strBuffer[point++]=jssp.Core.parse._handleDirective(directive);
strBuffer[point++]=" $out.print(unescape('";
i++;
}else if(nextTwo=="%>"){
strBuffer[point++]=(isPrint?");":"")+"\n $out.print(unescape('";
if(!betweenPerc) throw new jssp.Core.parse.ParseException("解析錯誤","必須用'%>'作為結(jié)束標(biāo)簽");
betweenPerc=false;
isPrint=false;
i+=1;
}else if(value.charAt(i)==String.fromCharCode(10)){
if(!betweenPerc){
strBuffer[point++]=escape(line)+"\\n'));\n"+" $out.print(unescape('";
line="";
lineNumber++;
}
}else if(value.charAt(i)==String.fromCharCode(13)){
if(betweenPerc) strBuffer[point++]="\n";
}else{
if(betweenPerc)
strBuffer[point++]=value.charAt(i);
else
line+=value.charAt(i);
}
}
strBuffer[point++]=escape(line)+"'));\n";
strBuffer[point++]="}catch(e){\n";
strBuffer[point++]="return '"+"執(zhí)行頁面發(fā)生異常.異常類型:'+e.name+'. 錯誤消息: '+e.message;\n";
strBuffer[point++]="}\n";
strBuffer[point++]="if(!$context.isIncluded) return $out.flush();\n";
strBuffer[point++]="}\n";
}catch(e){
point=0;
strBuffer=[];
strBuffer[point++]="function($context){\n";
strBuffer[point++]="return \""+"An exception occurred while parsing on line "+lineNumber+". Error type: "+e.name+". Error message: "+e.message+"\";";
strBuffer[point++]="}";
}
var out=strBuffer.join("");
return out;
}
/**
* 解析指示頭
*/
jssp.Core.parse._handleDirective=function(directive){
var i = 0;
var tolkenIndex = 0;
var tolken = new Array();
//Skip first spaces;
while ( directive.charAt(i) == ' ' ) {
i++;
}
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
tolkenIndex++;
//Skip first spaces;
while ( directive.charAt(i) == ' ' ) {
i++;
}
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && directive.charAt(i) != '=' && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
tolkenIndex++;
//Skip first spaces;
while ( directive.charAt(i) == ' ' ) {
i++;
}
if( directive.charAt(i) != '=' )
throw new jssp.Core.parse.ParseException("Sintax error", "Tolken = expected attribute");
i++
//Skip first spaces;
while ( directive.charAt(i) == ' ' ) {
i++;
}
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
tolkenIndex++;
//Skip first spaces;
while ( directive.charAt(i) == ' ' && i <= directive.length ) {
i++;
}
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && directive.charAt(i) != '=' && i <= directive.length && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
tolkenIndex++;
if( directive.charAt(i) != '=' && i <= directive.length )
throw new jssp.Core.parse.ParseException("Sintax error", "Tolken = expected after attribute" );
i++
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && i <= directive.length && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
var file = "";
var context = "";
if ( tolken[0] != "include" )
throw new jssp.Core.parse.ParseException("Sintax error","Directive " + tolken[0] + " unknown.") ;
if ( tolken[1] != "file" )
throw new jssp.Core.parse.ParseException("Sintax error", "Attribute file expected after include." );
else file = tolken[2];
if ( tolken[3] != "context" && tolken[3] != "" )
throw new jssp.Core.parse.ParseException( "Sintax error", "Attribute context expected after file.");
else if ( tolken[3] == "context" )
context = tolken[4]
else
context = "$context";
var out = "$context.include(" + file + ");\n";
return out;
}
/**
* 解析異常
*/
jssp.Core.parse.ParseException=function(name,message) {
this.name=name;
this.message=message;
}
//@--------------------------------------------------------------------------------頁面內(nèi)容加載接口定義
/**
* 頁面內(nèi)容加載類接口定義
*/
jssp.Core.PageLoader=function(){}
/**
* 讀取頁面文本
*/
jssp.Core.PageLoader.prototype.loadPage=function(pagePath){throw "不能直接調(diào)用接口或您還未實現(xiàn)此方法！";}
//@--------------------------------------------------------------------------------頁面運行實現(xiàn)方法
/**
* @param pagePath 加載頁面
* @parma context 上下文對象
*/
jssp.Core.run=function(pagePath,context){
if(!jssp.pageLoaderInstance){
//jssp引擎初始化
if(jssp.Config.cachable) jssp.cacheInstance=eval("new "+jssp.Config.cacheClass+"();");
jssp.pageLoaderInstance=eval("new "+jssp.Config.pageLoaderClass+"();");
}
var key=pagePath;if(key.indexOf("?")>0) key=key.substring(0,key.indexOf("?"));
var processer=jssp.Config.cachable?jssp.cacheInstance.get(key):null;
if(!processer){
eval("processer="+jssp.Core.parse(jssp.pageLoaderInstance.loadPage(pagePath)));
if(jssp.Config.cachable) jssp.cacheInstance.set(key,processer);
}else{
//alert("cache")
}
if(!context)
context=new jssp.Context(pagePath);
else
context=new jssp.Context(pagePath,context);
return processer(context);
}
//@-----------------------------------------------------------------------------------AJAX加載頁面實現(xiàn)
jssp.Core.PageLoader.Ajax=function(){}
jssp.Core.PageLoader.Ajax.prototype.loadPage=function(pagePath){
var content=jssp.Ajax.send(pagePath,"GET",false);
if(!content) {
alert("請求頁面:"+pagePath+" 返回為null！");return null;
}
return content;
}
//@-----------------------------------------------------------------------------------AJAX操作實現(xiàn)
jssp.Ajax=function(){}
/**
* 建立HTTP連接
*/
jssp.Ajax.createHttpRequest=function(){
if(window.XMLHttpRequest)
return new XMLHttpRequest();
var request=null;
try{
request=new ActiveXObject("Msxml2.XMLHTTP.4.0");
}catch(e){
try{
request=new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
request=new ActiveXObject("microsoft.XMLHTTP");
}catch(e){
throw "XMLHTTPRequest組件客戶端不支持！";
}
}
}
return request;
}
/**
* 發(fā)送AJAX請求
* @param url 請求頁面
* @param method 請求方法 get or post
* @param async 是否為異步調(diào)用
* @param callback 回調(diào)函數(shù)
* @param preHook 調(diào)用前執(zhí)行函數(shù)
* @param postHook 調(diào)用后請求返回執(zhí)行函數(shù)
*/
jssp.Ajax.send=function(url,method,async,callback,preHook,postHook){
method=method.toUpperCase();
if(typeof preHook=="function") preHook();
var request=jssp.Ajax.createHttpRequest();
request.open(method,url,async);
if(async){
if(typeof callback!="function") throw "必須要設(shè)置回調(diào)函數(shù)";
request.onreadystatechange=function(){
jssp.Ajax.callback(request,callback,postHook);
};
}
request.send(null);
if(!async) {
if(request.status==200||request.status==304)
return jssp.Ajax._chartset(request);
else
return null;
}
}
/**
* 接受響應(yīng)，調(diào)用自定義回調(diào)函數(shù)
*/
jssp.Ajax.callback=function(response,callback,postHook){
if(response.readyState!=4) return;
var text;
if(response.status==200||response.status==304){
text=jssp.Ajax._chartset(response);
}
callback(text);
if(typeof postHook=="function") postHook();
}
/**
* 中文亂碼處理
*/
jssp.Ajax._chartset=function(r){
var t=bytes2BSTR(r.responseBody);
return t;
}
</script>
<script language="javascript">
jssp.Config.pageLoaderClass="jssp.Core.PageLoader.CustomerInput";//設(shè)置頁面讀取接口
jssp.Config.cachable=false;
jssp.Core.PageLoader.CustomerInput=function(){}
jssp.Core.PageLoader.CustomerInput.prototype.loadPage=function(pagePath){
if(pagePath.substring(0,10)!="hello.jssp") return "測試包含子頁面,路徑:"+pagePath;
return document.getElementById("pageContent").value;
}
function showPage(){
jssp.render("hello.jssp?name="+Math.random(),"pageArea");
}
</script>
<style type="text/css">
<!--
.STYLE1 {color: #FFFFFF}
-->
</style>
</head>
<body>
輸入JSSP腳本內(nèi)容：
<textarea id="pageContent" style="width:100%;" rows="15">
<table width="100%" border="0" align="center" cellpadding="4" cellspacing="2">
<tr>
<td align="center" valign="middle" bgcolor="#666699"><span class="STYLE1">order</span></td>
<td align="center" valign="middle" bgcolor="#666699"><span class="STYLE1">number1</span></td>
<td align="center" valign="middle" bgcolor="#666699"><span class="STYLE1">number2</span></td>
<td align="center" valign="middle" bgcolor="#666699"><span class="STYLE1">number3</span></td>
</tr>
<%
var beginTime=new Date();
for(var i=0;i<100;i++){
var color=i%2?"#eeeeee":"#aaaaaa";
%>
<tr bgcolor="<%=color%>">
<td align="center" valign="middle" ><%=i%></td>
<td align="center" valign="middle" ><%=Math.random()%></td>
<td align="center" valign="middle" ><%=Math.random()%></td>
<td align="center" valign="middle" ><%=Math.random()%></td>
</tr>
<%}%>
</table>
<%
window.alert("耗時:"+(new Date()-beginTime)+"ms");
%>
</textarea>
<button onClick="showPage()">顯示內(nèi)容</button>
<hr>
<div id="pageArea"></div>
</hr>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xht...
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>jssp演示</title>
<script language="javascript">
/**
* @description:
* 使用javascript模仿JSP的頁面解析和運行，運行于客戶端
* 允許應(yīng)用人員象開發(fā)JSP頁面一樣使用<%..%>
* 允許頁面動態(tài)包括子頁面（同步讀取頁面）
*
**/
//@--------------------------------------------------------------------- JSSP聲明
var jssp=function(){};
/**
* 頁面緩存管理實例對象
*/
jssp.cacheInstance=null;
/**
* 頁面加載實例對象
*/
jssp.pageLoaderInstance=null;
/**
* 在指定dom插入pagePath的執(zhí)行后的頁面內(nèi)容
*/
jssp.render=function(pagePath,dom){
if(typeof dom=="string") dom=document.getElementById(dom);
var content=jssp.Core.run(pagePath);
dom.innerHTML=content;
}
//@------------------------------------------------------------------------ JSSP運行配置
/**
* 引擎運行全局配置
*/
jssp.Config={};
/**
* 如果在客戶端運行，是否緩存解析的頁面
*/
jssp.Config.cachable=true;
/**
* 當(dāng)jssp.Config.cacheable為true且在
*/
jssp.Config.cacheClass="jssp.Cache.DefaultCache";
/**
* 頁面內(nèi)容讀取器
*/
jssp.Config.pageLoaderClass="jssp.Core.PageLoader.Ajax";
//@------------------------------------------------------------------------ JSSP頁面緩存類
/**
* 頁面緩存類
*/
jssp.Cache=function(){}
/**
* 設(shè)置緩存
*/
jssp.Cache.prototype.set=function(key,cache){}
/**
* 得到緩存
*/
jssp.Cache.prototype.get=function(key){}
/**
* 默認的緩存實現(xiàn)類
*/
jssp.Cache.DefaultCache=function(){
this.caches={};
}
jssp.Cache.DefaultCache.prototype.set=function(key,cache){
this.caches[key]=cache;
}
jssp.Cache.DefaultCache.prototype.get=function(key){
return this.caches[key];
}
//@----------------------------------------------------------------------- JSSP運行上下文類
/**
* jssp頁面的執(zhí)行上下文對象
* @member params 請求參數(shù)數(shù)組
* @member cookies 操作cookies對象 jssp.Cookies
* @member out 頁面流輸出對象 jssp.Out
* @method setAttribute 設(shè)置上下文參數(shù)
* @method getAttribute 得到上下文參數(shù)
* @method removeAttribute 刪除上下文參數(shù)
* @method include 動態(tài)包含子頁面
* @method getCookies,getParameter,getParameters,getOut
* @param pageUrl 運行的上下文參數(shù)
* @param context 父頁面的上下文對象
*/
jssp.Context=function(pageUrl,context){
this.params=this._resolveParam(pageUrl);
if(!context){
this.cookies=jssp.Cookies;
this.out=new jssp.Out();
this.attributes=[];
}else{
this.context=context;
this.isIncluded=true;
}
}
/**
* 解析頁面后綴參數(shù)
*/
jssp.Context.prototype._resolveParam=function(pageUrl){
var i1=pageUrl.indexOf("?");
if(i1<=0) return [];
pageUrl=pageUrl.substring(i1+1);
var s1=pageUrl.split("&");
var params=[];
for(var i=0;i<s1.length;i++){
var s2=s1[i].split("=");
var key=s2[0];var value=s2[1];
var ps=params[key];
if(!ps) ps=[];
ps[ps.length]=value;
params[key]=ps;
}
return params;
}
/**
* 設(shè)置參數(shù)值
*/
jssp.Context.prototype.setAttribute=function(key,value){
if(!this.context)
this.attributes[key]=value;
else
this.context.setAttribute(key,value);
}
/**
* 得到參數(shù)值
*/
jssp.Context.prototype.getAttribute=function(key){
if(!this.context)
return this.attributes[key];
else
return this.context.getAttribute(key);
}
/**
* 刪除指定鍵的參數(shù)值
*/
jssp.Context.prototype.removeAttribute=function(key){
if(!this.context)
this.attributes[key]=undefined;
else
this.context.removeAttribute(key);
}
/**
* 得到請求參數(shù)值
*/
jssp.Context.prototype.getParameter=function(key){
var ps=this.params[key];
if(!ps) return this.context?this.context.getParameter(key):undefined;
return ps.join(",");
}
/**
* 得到有重復(fù)參數(shù)的值
*/
jssp.Context.prototype.getParameters=function(key){
var pss=this.params[key];
if(!pss) pss=this.context?this.context.getParameters(key):undefined;
return pss;
}
/**
* 得到cookies對象
*/
jssp.Context.prototype.getCookies=function(){
if(!this.context)
return this.cookies;
else
return this.context.getCookies();
}
/**
* 得到輸出流OUT對象
*/
jssp.Context.prototype.getOut=function(){
if(!this.context)
return this.out;
else
return this.context.getOut();
}
/**
* 動態(tài)包含子頁面
*/
jssp.Context.prototype.include=function(childPageUrl){
this.getOut().print(jssp.Core.run(childPageUrl,this));
}
jssp.Context.prototype.isIncluded=false;//判斷當(dāng)前頁面是否被包含的
//@-----------------------------------------------------------------------JSSP運行cookies操作類
/**
* 簡單操縱cookies方法
*/
jssp.Cookies=function(){}
/**
* 設(shè)置cookie項
*/
jssp.Cookies.set=function(key,value){
document.cookie=key+"="+escape(value)+";";
}
/**
* 得到cookie項
*/
jssp.Cookies.get=function(key){
var aCookie=document.cookie.split("; ");
for(var i=0;i<aCookie.length;i++){
var aCrumb=aCookie[i].split("=");
if(key==aCrumb[0])
return unescape(aCrumb[1]);
}
}
/**
* 刪除cookies項
*/
jssp.Cookies.remove=function(key){
document.cookie=key+"=null; expires=Fri, 31 Dec 1999 23:59:59 GMT;";
}
//@------------------------------------------------------------------------ JSSP頁面運行輸出流類
/**
* 頁面流輸出對象
*/
jssp.Out=function(){
this.datas=[];//數(shù)據(jù)流片斷
this._index=0;
}
/**
* 把頁面流片斷放入緩沖區(qū)
*/
jssp.Out.prototype.print=function(s){
this.datas[this._index++]=s;
}
/**
* 輸出緩沖區(qū)里的數(shù)據(jù)
*/
jssp.Out.prototype.flush=function(){
var data=this.datas.join("");
this.datas=[];this._index=0;
return data;
}
//@--------------------------------------------------------------------------JSSP頁面核心類聲明
jssp.Core=function(){}
//@--------------------------------------------------------------------------JSSP頁面解析實現(xiàn)類
/**
* 頁面解析
* @param pageContent JSSP頁面內(nèi)容
*/
jssp.Core.parse=function(pageContent){
var strBuffer=[];//解析后文本存放的緩沖區(qū)
var point=0;//緩沖區(qū)指針
var lineNumber=1;//解析的當(dāng)前行
try{
var betweenPerc=false;
var isPrint=false;
strBuffer[point++]="function($context){\n";
strBuffer[point++]="var $out=$context.getOut();\n";
strBuffer[point++]="var $cookies=$context.getCookies();\n";
strBuffer[point++]="try{\n";
strBuffer[point++]="$out.print(unescape('";
var line="";
var value=pageContent;
var len=value.length;
for(var i=0;i<len;i++){
var nextTwo="";
if(i<=len-2) nextTwo=value.charAt(i)+value.charAt(i+1);
var nextThree="";
if(i<=len-3) nextThree=nextTwo+value.charAt(i+2);
if(nextTwo=="<%"&&nextThree!="<%="&&nextThree!="<%@"){
strBuffer[point++]="'));\n";
betweenPerc=true;
i+=1;
}else if(nextTwo=="<%"&&nextThree=="<%="&&nextThree!="<%@"){
strBuffer[point++]=escape(line)+"'));\n";
line="";
strBuffer[point++]=" $out.print( ";
betweenPerc=true;
isPrint=true;
i+=2;
}else if(nextTwo=="<%"&&nextThree!="<%="&&nextThree=="<%@"){
i+=3;
var directive="";
while(nextTwo!="%>"){
directive+=value.charAt(i);
i++;
if(i<=value.length-2){
nextTwo=value.charAt(i)+value.charAt(i+1);
}
}
strBuffer[point++]=escape(line)+"'));\n";
line="";
strBuffer[point++]=jssp.Core.parse._handleDirective(directive);
strBuffer[point++]=" $out.print(unescape('";
i++;
}else if(nextTwo=="%>"){
strBuffer[point++]=(isPrint?");":"")+"\n $out.print(unescape('";
if(!betweenPerc) throw new jssp.Core.parse.ParseException("解析錯誤","必須用'%>'作為結(jié)束標(biāo)簽");
betweenPerc=false;
isPrint=false;
i+=1;
}else if(value.charAt(i)==String.fromCharCode(10)){
if(!betweenPerc){
strBuffer[point++]=escape(line)+"\\n'));\n"+" $out.print(unescape('";
line="";
lineNumber++;
}
}else if(value.charAt(i)==String.fromCharCode(13)){
if(betweenPerc) strBuffer[point++]="\n";
}else{
if(betweenPerc)
strBuffer[point++]=value.charAt(i);
else
line+=value.charAt(i);
}
}
strBuffer[point++]=escape(line)+"'));\n";
strBuffer[point++]="}catch(e){\n";
strBuffer[point++]="return '"+"執(zhí)行頁面發(fā)生異常.異常類型:'+e.name+'. 錯誤消息: '+e.message;\n";
strBuffer[point++]="}\n";
strBuffer[point++]="if(!$context.isIncluded) return $out.flush();\n";
strBuffer[point++]="}\n";
}catch(e){
point=0;
strBuffer=[];
strBuffer[point++]="function($context){\n";
strBuffer[point++]="return \""+"An exception occurred while parsing on line "+lineNumber+". Error type: "+e.name+". Error message: "+e.message+"\";";
strBuffer[point++]="}";
}
var out=strBuffer.join("");
return out;
}
/**
* 解析指示頭
*/
jssp.Core.parse._handleDirective=function(directive){
var i = 0;
var tolkenIndex = 0;
var tolken = new Array();
//Skip first spaces;
while ( directive.charAt(i) == ' ' ) {
i++;
}
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
tolkenIndex++;
//Skip first spaces;
while ( directive.charAt(i) == ' ' ) {
i++;
}
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && directive.charAt(i) != '=' && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
tolkenIndex++;
//Skip first spaces;
while ( directive.charAt(i) == ' ' ) {
i++;
}
if( directive.charAt(i) != '=' )
throw new jssp.Core.parse.ParseException("Sintax error", "Tolken = expected attribute");
i++
//Skip first spaces;
while ( directive.charAt(i) == ' ' ) {
i++;
}
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
tolkenIndex++;
//Skip first spaces;
while ( directive.charAt(i) == ' ' && i <= directive.length ) {
i++;
}
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && directive.charAt(i) != '=' && i <= directive.length && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
tolkenIndex++;
if( directive.charAt(i) != '=' && i <= directive.length )
throw new jssp.Core.parse.ParseException("Sintax error", "Tolken = expected after attribute" );
i++
tolken[tolkenIndex] = "";
while ( directive.charAt(i) != ' ' && i <= directive.length && i <= directive.length ) {
tolken[tolkenIndex] += directive.charAt(i);
i++;
}
var file = "";
var context = "";
if ( tolken[0] != "include" )
throw new jssp.Core.parse.ParseException("Sintax error","Directive " + tolken[0] + " unknown.") ;
if ( tolken[1] != "file" )
throw new jssp.Core.parse.ParseException("Sintax error", "Attribute file expected after include." );
else file = tolken[2];
if ( tolken[3] != "context" && tolken[3] != "" )
throw new jssp.Core.parse.ParseException( "Sintax error", "Attribute context expected after file.");
else if ( tolken[3] == "context" )
context = tolken[4]
else
context = "$context";
var out = "$context.include(" + file + ");\n";
return out;
}
/**
* 解析異常
*/
jssp.Core.parse.ParseException=function(name,message) {
this.name=name;
this.message=message;
}
//@--------------------------------------------------------------------------------頁面內(nèi)容加載接口定義
/**
* 頁面內(nèi)容加載類接口定義
*/
jssp.Core.PageLoader=function(){}
/**
* 讀取頁面文本
*/
jssp.Core.PageLoader.prototype.loadPage=function(pagePath){throw "不能直接調(diào)用接口或您還未實現(xiàn)此方法！";}
//@--------------------------------------------------------------------------------頁面運行實現(xiàn)方法
/**
* @param pagePath 加載頁面
* @parma context 上下文對象
*/
jssp.Core.run=function(pagePath,context){
if(!jssp.pageLoaderInstance){
//jssp引擎初始化
if(jssp.Config.cachable) jssp.cacheInstance=eval("new "+jssp.Config.cacheClass+"();");
jssp.pageLoaderInstance=eval("new "+jssp.Config.pageLoaderClass+"();");
}
var key=pagePath;if(key.indexOf("?")>0) key=key.substring(0,key.indexOf("?"));
var processer=jssp.Config.cachable?jssp.cacheInstance.get(key):null;
if(!processer){
eval("processer="+jssp.Core.parse(jssp.pageLoaderInstance.loadPage(pagePath)));
if(jssp.Config.cachable) jssp.cacheInstance.set(key,processer);
}else{
//alert("cache")
}
if(!context)
context=new jssp.Context(pagePath);
else
context=new jssp.Context(pagePath,context);
return processer(context);
}
//@-----------------------------------------------------------------------------------AJAX加載頁面實現(xiàn)
jssp.Core.PageLoader.Ajax=function(){}
jssp.Core.PageLoader.Ajax.prototype.loadPage=function(pagePath){
var content=jssp.Ajax.send(pagePath,"GET",false);
if(!content) {
alert("請求頁面:"+pagePath+" 返回為null！");return null;
}
return content;
}
//@-----------------------------------------------------------------------------------AJAX操作實現(xiàn)
jssp.Ajax=function(){}
/**
* 建立HTTP連接
*/
jssp.Ajax.createHttpRequest=function(){
if(window.XMLHttpRequest)
return new XMLHttpRequest();
var request=null;
try{
request=new ActiveXObject("Msxml2.XMLHTTP.4.0");
}catch(e){
try{
request=new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
request=new ActiveXObject("microsoft.XMLHTTP");
}catch(e){
throw "XMLHTTPRequest組件客戶端不支持！";
}
}
}
return request;
}
/**
* 發(fā)送AJAX請求
* @param url 請求頁面
* @param method 請求方法 get or post
* @param async 是否為異步調(diào)用
* @param callback 回調(diào)函數(shù)
* @param preHook 調(diào)用前執(zhí)行函數(shù)
* @param postHook 調(diào)用后請求返回執(zhí)行函數(shù)
*/
jssp.Ajax.send=function(url,method,async,callback,preHook,postHook){
method=method.toUpperCase();
if(typeof preHook=="function") preHook();
var request=jssp.Ajax.createHttpRequest();
request.open(method,url,async);
if(async){
if(typeof callback!="function") throw "必須要設(shè)置回調(diào)函數(shù)";
request.onreadystatechange=function(){
jssp.Ajax.callback(request,callback,postHook);
};
}
request.send(null);
if(!async) {
if(request.status==200||request.status==304)
return jssp.Ajax._chartset(request);
else
return null;
}
}
/**
* 接受響應(yīng)，調(diào)用自定義回調(diào)函數(shù)
*/
jssp.Ajax.callback=function(response,callback,postHook){
if(response.readyState!=4) return;
var text;
if(response.status==200||response.status==304){
text=jssp.Ajax._chartset(response);
}
callback(text);
if(typeof postHook=="function") postHook();
}
/**
* 中文亂碼處理
*/
jssp.Ajax._chartset=function(r){
var t=bytes2BSTR(r.responseBody);
return t;
}
</script>
<script language="javascript">
jssp.Config.pageLoaderClass="jssp.Core.PageLoader.CustomerInput";//設(shè)置頁面讀取接口
jssp.Config.cachable=false;
jssp.Core.PageLoader.CustomerInput=function(){}
jssp.Core.PageLoader.CustomerInput.prototype.loadPage=function(pagePath){
if(pagePath.substring(0,10)!="hello.jssp") return "測試包含子頁面,路徑:"+pagePath;
return document.getElementById("pageContent").value;
}
function showPage(){
jssp.render("hello.jssp?name="+Math.random(),"pageArea");
}
</script>
<style type="text/css">
<!--
.STYLE1 {color: #FFFFFF}
-->
</style>
</head>
<body>
輸入JSSP腳本內(nèi)容：
<textarea id="pageContent" style="width:100%;" rows="15">
<table width="100%" border="0" align="center" cellpadding="4" cellspacing="2">
<tr>
<td align="center" valign="middle" bgcolor="#666699"><span class="STYLE1">order</span></td>
<td align="center" valign="middle" bgcolor="#666699"><span class="STYLE1">number1</span></td>
<td align="center" valign="middle" bgcolor="#666699"><span class="STYLE1">number2</span></td>
<td align="center" valign="middle" bgcolor="#666699"><span class="STYLE1">number3</span></td>
</tr>
<%
var beginTime=new Date();
for(var i=0;i<100;i++){
var color=i%2?"#eeeeee":"#aaaaaa";
%>
<tr bgcolor="<%=color%>">
<td align="center" valign="middle" ><%=i%></td>
<td align="center" valign="middle" ><%=Math.random()%></td>
<td align="center" valign="middle" ><%=Math.random()%></td>
<td align="center" valign="middle" ><%=Math.random()%></td>
</tr>
<%}%>
</table>
<%
window.alert("耗時:"+(new Date()-beginTime)+"ms");
%>
</textarea>
<button onClick="showPage()">顯示內(nèi)容</button>
<hr>
<div id="pageArea"></div>
</hr>
</body>
</html>
相關(guān)文章
淺析JavaScript中的call、apply和bind方法
JavaScript中的call、apply和bind方法是用于改變函數(shù)執(zhí)行上下文和預(yù)先設(shè)置參數(shù)的強大工具，它們在編寫可維護和優(yōu)雅的代碼時起到了重要的作用，本文將介紹這些方法的原理和使用場景，并展示如何將它們應(yīng)用于你的代碼中，使其更加漂亮2023-06-06
使用云開發(fā)開發(fā)微信小程序、小游戲，無需搭建服務(wù)器，這篇文章主要為大家詳細介紹了微信小程序云開發(fā)數(shù)據(jù)庫，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-05-05
這篇文章主要介紹了JavaScript作用域鏈,結(jié)合實例形式較為詳細的分析了作用域鏈的原理、功能與相關(guān)操作注意事項,需要的朋友可以參考下2019-01-01
這篇文章主要介紹了聊聊鑒權(quán)那些事(推薦)，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08
在Mac、Ubuntu、Windows、Centos下如何安裝Node.js，想必有一些朋友還不會吧，本文整理了一些，需要的朋友可以參考下2013-11-11
本文主要介紹了如何在 TypeScript 中聲明全局變量,在TypeScript中,可以使用declare關(guān)鍵字來聲明全局變量,這樣的聲明告訴編譯器該變量是在其他地方定義的,而不需要實際的實現(xiàn),文中通過代碼示例介紹的非常詳細,需要的朋友可以參考下2023-08-08
javascript中call,apply,bind函數(shù)用法示例
這篇文章主要介紹了javascript中call,apply,bind函數(shù)用法,結(jié)合實例形式分析了call,apply,bind函數(shù)的功能、使用方法與相關(guān)注意事項,需要的朋友可以參考下2016-12-12
Js查找字符串中出現(xiàn)次數(shù)最多的字符及個數(shù)實例解析
這篇文章主要介紹了Js查找字符串中出現(xiàn)次數(shù)最多的字符及個數(shù) ,本文分為傳統(tǒng)寫法和正則寫法兩種方法給大家介紹了js查找字符串出現(xiàn)次數(shù)最多的字符及個數(shù)，非常不錯，感興趣的朋友參考下吧2016-09-09
類型檢查是一種靜態(tài)分析的過程，用于驗證變量、函數(shù)和表達式的類型是否符合預(yù)期，這篇文章主要來和大家聊聊TypeScript中類型檢查與錯誤捕獲的相關(guān)知識，希望對大家有所幫助2023-06-06
下面小編就為大家?guī)硪黄猻witch語句的妙用(必看篇)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-10