Javascript模板技术


Posted in Javascript onApril 27, 2007

/***Template.class.js***/

function Template()
{
this.classname="Template";
this.debug=false;
this.file=new HashMap();
this.root="";
this.varkeys=new  HashMap();
this.varvals=new  HashMap();
this.unknowns="remove";
this.halt_on_error="yes";
this.last_error=""; 
this.fso=new ActiveXObject("Scripting.FileSystemObject");
this.set_root=_set_root;
this.set_unknowns=_set_unknowns;
this.get_var=_get_var;
this.set_file=_set_file;
this.set_var=_set_var;
this.set_block=_set_block;
this.subst=_subst;
this.parse=_parse;
this.p=_p;
this.pparse=_pparse;
this.finish=_finish;
this.loadfile=_loadfile;
this.is_dir=_is_dir;
this.file_exists=_file_exists;
this.filename=_filename;
this.varname=_varname;
this.halt=_halt;
this.haltmsg=_haltmsg;
}

/**
* 设置模板文件根目录
* @param root
*/
function _set_root(root)
{
if(!this.is_dir(root))
{
 this.halt("set_root:"+root+" is not a directory.");
}
this.root=root;
}

/**
* 设定对未知模板变量的处理办法
* @param unknowns
*/
function _set_unknowns(unknowns)
{
this.unknowns=unknowns;
}

/**
* 设定模板文件
* @param handle
* @param filename
*/
function _set_file(handle,filename)
{
this.file.put(handle,this.filename(filename));
}

/**
* 设定模板变量
* @param varname
* @param value
*/
function _set_var(varname,value)
{
if(!this.varkeys.containsKey(varname))
{
 this.varkeys.put(varname,this.varname(varname));
}
if(!this.varvals.containsKey(varname))
{
 this.varvals.put(varname,value);
}
else
{
 this.varvals.remove(varname);
 this.varvals.put(varname,value);
}
//alert(varname+"=================="+value);
}

/**
* 设定块变量
* @param parent
* @param handle
* @param name
*/
function _set_block(parent,handle,name)
{
if(!this.loadfile(parent))

 this.halt("subst:unable to load "+parent);
}
if(name=="")
{
 name=handle;
}
var str=this.get_var(parent);
var re=new RegExp("<!--\\s+BEGIN " + handle + "\\s+-->([\\s\\S.]*)<!--\\s+END " + handle + "\\s+-->");
//Matcher m=p.matcher(str);
//var rs=m.find();
//var t=m.group(m.groupCount());
//this.set_var(handle,t);
var arr=re.exec(str);
if(arr!=null)
 this.set_var(handle,RegExp.$1);
str=str.replace(re,"{"+name+"}");
this.set_var(parent,str);
}

/**
* 进行变量替换
* @param handle
* @return 
*/
function _subst(handle)
{
if(!this.loadfile(handle))
{
 this.halt("subst:unable to load "+handle);
}
var str=this.get_var(handle);
var keys=this.varkeys.keySet();
//alert(keys.length);
for(var i=0;i<keys.length;i++)
{
 var key=keys[i];
 var re=new RegExp(this.varkeys.get(key),"g")
 str=str.replace(re,this.varvals.get(key));
}
   //alert(handle+"++++++++++++++++++"+str);
return str;
}

/**
* 进行变量复制
* @param target
* @param handle
* @param append
*/
function _parse(target,handle,append)
{
var str=this.subst(handle);
if(append)
{
 this.set_var(target,this.get_var(target)+str);
}
else
{
 this.set_var(target,str);
}
}

/**
* 返回替换后的文件
* @param varname
* @return 
*/
function _p(varname)
{
return this.finish(this.get_var(varname));
}

/**
* parse()和p()的合并
* @param target
* @param handle
* @param append
* @return 
*/
function _pparse(target,handle,append)
{
this.parse(target,handle,append);
document.writeln(this.p(target));
}

/**
* 加载模板文件
* @param handle
* @return 
*/
function _loadfile(handle)
{
if(this.varkeys.containsKey(handle) && this.varvals.get(handle)!=null)
{
 return true;
}
if(!this.file.containsKey(handle))
{
 _halt("loadfile:"+handle+" is not a valid handle.");
 return false;
}
var  filename=this.file.get(handle);
if(!this.file_exists(filename))
{
 this.halt("loadfile:while loading "+handle+","+filename+" does not exist.");
 return false;
}
try
{
 var fr=this.fso.OpenTextFile(filename); 
 var s=fr.ReadAll();
 if(s=="")
 {
  halt("loadfile:while loading "+handle+","+filename+" is empty.");
  return false;
 }
 this.set_var(handle,s);
}
catch(e)
{

}
return true;
}

/**
* 获取变量
* @param varname
* @return 
*/
function _get_var(varname)
{
if(this.varvals.containsKey(varname))
 return this.varvals.get(varname);
else
 return "";
}

/**
* 判断目录
* @param path
* @return 
*/
function _is_dir(path)
{
if(this.fso.FolderExists(path))
 return true;
else
 return false;
}

/**
* 判断文件
* @param filename
* @return 
*/
function _file_exists(filename)
{
if(this.fso.FileExists(filename))
 return true;
else
 return false;
}

/**
* 文件名处理
* @param filename
* @return 
*/
function _filename(filename)
{
if(!this.file_exists(this.root+filename))
{
 this.halt("filename:file "+filename+" does not exist.");
}
return this.root+filename;
}

/**
* 变量名处理
* @param varname
* @return 
*/
function _varname(varname)
{
return "{"+varname+"}";
}

/**
* 完成字符串的处理
* @param str
* @return 
*/
function _finish(str)
{
var re=new RegExp("{[^ \\t\\r\\n\\}]+\\}","g");
if(this.unknowns=="remove")
{
 str=str.replace(re,"");
}
else if(this.unknowns=="comment")
{
 str=str.replace(re,"<!-- Template Variable undefined -->");
}
else
{

}
return str;
}

function _halt(msg)
{
this.last_error=msg;
if(this.halt_on_error!="no")
{
 _haltmsg(msg);
}
if(this.halt_on_error=="yes")
{
 alert("Halted.");
 //System.exit(0);
}
}

function _haltmsg(msg)
{
alert("Template Error:"+msg);
}

/**
* HashMap构造函数
*/
function HashMap()
{
   this.length = 0;
   this.prefix = "hashmap_prefix_20050524_";
}
/**
* 向HashMap中添加键值对
*/
HashMap.prototype.put = function (key, value)
{
   this[this.prefix + key] = value;
   this.length ++;
}
/**
* 从HashMap中获取value值
*/
HashMap.prototype.get = function(key)
{
   return typeof this[this.prefix + key] == "undefined" 
           ? null : this[this.prefix + key];
}
/**
* 从HashMap中获取所有key的集合,以数组形式返回
*/
HashMap.prototype.keySet = function()
{
   var arrKeySet = new Array();
   var index = 0;
   for(var strKey in this)
   {
       if(strKey.substring(0,this.prefix.length) == this.prefix)
           arrKeySet[index ++] = strKey.substring(this.prefix.length);
   }
   return arrKeySet.length == 0 ? null : arrKeySet;
}
/**
* 从HashMap中获取value的集合,以数组形式返回
*/
HashMap.prototype.values = function()
{
   var arrValues = new Array();
   var index = 0;
   for(var strKey in this)
   {
       if(strKey.substring(0,this.prefix.length) == this.prefix)
           arrValues[index ++] = this[strKey];
   }
   return arrValues.length == 0 ? null : arrValues;
}
/**
* 获取HashMap的value值数量
*/
HashMap.prototype.size = function()
{
   return this.length;
}
/**
* 删除指定的值
*/
HashMap.prototype.remove = function(key)
{
   delete this[this.prefix + key];
   this.length --;
}
/**
* 清空HashMap
*/
HashMap.prototype.clear = function()
{
   for(var strKey in this)
   {
       if(strKey.substring(0,this.prefix.length) == this.prefix)
           delete this[strKey];   
   }
   this.length = 0;
}
/**
* 判断HashMap是否为空
*/
HashMap.prototype.isEmpty = function()
{
   return this.length == 0;
}
/**
* 判断HashMap是否存在某个key
*/
HashMap.prototype.containsKey = function(key)
{
   for(var strKey in this)
   {
      if(strKey == this.prefix + key)
         return true;  
   }
   return false;
}
/**
* 判断HashMap是否存在某个value
*/
HashMap.prototype.containsValue = function(value)
{
   for(var strKey in this)
   {
      if(this[strKey] == value)
         return true;  
   }
   return false;
}
/**
* 把一个HashMap的值加入到另一个HashMap中,参数必须是HashMap
*/
HashMap.prototype.putAll = function(map)
{
   if(map == null)
       return;
   if(map.constructor != JHashMap)
       return;
   var arrKey = map.keySet();
   var arrValue = map.values();
   for(var i in arrKey)
      this.put(arrKey[i],arrValue[i]);
}
//toString
HashMap.prototype.toString = function()
{
   var str = "";
   for(var strKey in this)

   {
       if(strKey.substring(0,this.prefix.length) == this.prefix)
             str += strKey.substring(this.prefix.length) 
                 + " : " + this[strKey] + "\r\n";
   }
   return str;
}

<!--     main.htm     -->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4...
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>

<body>
<p>{HEAD}</p>
<p>{WELCOME}
</p>
<table width="100%"  border="1" cellspacing="1" cellpadding="3">
 <!-- BEGIN BROWS -->
 <tr>
  <!-- BEGIN BCOLS -->
   <td>{NUMBER}</td>
<!-- END BCOLS --> 
 </tr>
 <!-- END BROWS -->
</table>
<p>{FOOT}</p>
</body>
</html>

<!--      head.htm       -->

<table width="100%"  border="1" cellspacing="1" cellpadding="3">
 <tr>
   <td>网站首页</td>
 </tr>
</table>

<!--     foot.htm       -->

<table width="100%"  border="1" cellspacing="1" cellpadding="3">
 <tr>
   <td>版权所有:网站梦工厂</td>
 </tr>
</table>

<!--    index.htm     -->

<script src="/script/Template.class.js"></script>
<script>
var tmplt=new Template();
var root=location.href;
root=unescape(root.substring(8,root.lastIndexOf("/")+1));
tmplt.set_root(root);
tmplt.set_file("fh","tpl/main.htm");
tmplt.set_file("head","tpl/head.htm");
tmplt.set_file("foot","tpl/foot.htm");
tmplt.set_block("fh","BROWS","rows");
tmplt.set_block("BROWS","BCOLS","cols");
tmplt.set_var("WELCOME","欢迎光临");
for(var i=0;i<10;i++)
{
tmplt.set_var("cols","");
for(var j=0;j<10;j++)
{
 tmplt.set_var("NUMBER",i+"."+j);
 tmplt.parse("cols","BCOLS",true);
}
tmplt.parse("rows","BROWS",true);
}
tmplt.parse("HEAD","head",false);
tmplt.parse("FOOT","foot",false);
tmplt.pparse("out","fh",false);
</script>

Javascript 相关文章推荐
我的Node.js学习之路(一)
Jul 06 Javascript
js实现的全国省市二级联动下拉选择菜单完整实例
Aug 17 Javascript
JavaScript实现点击按钮就复制当前网址
Dec 14 Javascript
BOM系列第二篇之定时器requestAnimationFrame
Aug 17 Javascript
AngularJs  Understanding Angular Templates
Sep 02 Javascript
DropDownList实现可输入可选择(两种版本可选)
Dec 07 Javascript
利用types增强vscode中js代码提示功能详解
Jul 07 Javascript
vue中的模态对话框组件实现过程
May 01 Javascript
JavaScript学习教程之cookie与webstorage
Jun 23 Javascript
Vue配置marked链接添加target=&quot;_blank&quot;的方法
Jul 19 Javascript
微信小程序实现点击页面出现文字
Sep 21 Javascript
javascript实现简易计算器功能
Sep 23 Javascript
javascript函数库-集合框架
Apr 27 #Javascript
仿服务器端脚本方式的JS模板实现方法
Apr 27 #Javascript
改版了网上的一个js操作userdata
Apr 27 #Javascript
用 JSON 处理缓存
Apr 27 #Javascript
转一个日期输入控件,支持FF
Apr 27 #Javascript
学习jquery之一
Apr 27 #Javascript
JavaScript与函数式编程解释
Apr 27 #Javascript
You might like
PHP 处理图片的类实现代码
2009/10/23 PHP
PHP+SQL 注入攻击的技术实现以及预防办法
2011/01/27 PHP
php中存储用户ID和密码到mysql数据库的方法
2013/02/06 PHP
php通过array_merge()函数合并两个数组的方法
2015/03/18 PHP
jQuery each()方法的使用方法
2010/03/18 Javascript
扩展Jquery插件处理mouseover时内部有子元素时发生样式闪烁
2011/12/08 Javascript
解决jquery submit()提交表单提示:f[s] is not a function
2013/01/23 Javascript
查看大图功能代码jquery版
2013/11/05 Javascript
PHP PDO操作总结
2014/11/17 Javascript
js实现精确到秒的倒计时效果
2016/05/29 Javascript
AngularGauge 属性解析详解
2016/09/06 Javascript
微信小程序  modal弹框组件详解
2016/10/27 Javascript
zTree获取当前节点的下一级子节点数实例
2017/09/05 Javascript
基于 jQuery 实现键盘事件监听控件
2019/04/04 jQuery
vue中使用vue-cli接入融云实现即时通信
2019/04/19 Javascript
Ajax请求时无法重定向的问题解决代码详解
2019/06/21 Javascript
[02:33]2018 DOTA2亚洲邀请赛回顾视频 再次拾起那些美妙的时刻
2018/04/10 DOTA
一键搞定python连接mysql驱动有关问题(windows版本)
2016/04/23 Python
python web框架学习笔记
2016/05/03 Python
python flask中静态文件的管理方法
2018/03/20 Python
Python常用爬虫代码总结方便查询
2019/02/25 Python
面向对象学习之pygame坦克大战
2019/09/11 Python
Python高级特性之闭包与装饰器实例详解
2019/11/19 Python
python实现多进程按序号批量修改文件名的方法示例
2019/12/30 Python
Django权限控制的使用
2021/01/07 Python
皮尔·卡丹巴西官方商店:Pierre Cardin
2017/07/21 全球购物
Whittard官方海外旗舰店:英国百年茶叶品牌
2018/02/22 全球购物
在加拿大在线租赁和购买电子游戏:Game Access
2019/09/02 全球购物
军训 自我鉴定
2014/02/03 职场文书
舞蹈比赛获奖感言
2014/02/04 职场文书
吃空饷专项治理工作实施方案
2014/03/04 职场文书
学生会副主席竞聘书
2014/03/31 职场文书
社区学习雷锋活动总结
2014/04/25 职场文书
装饰工程师岗位职责
2014/06/08 职场文书
工作作风建设心得体会
2014/10/22 职场文书
2015年高中班级工作总结
2015/07/21 职场文书