查看文章
 
几个函数——我的json->html
2010-02-03 0:20

        一直想做Javascript templates,不管对不对,这也算是探索路上的一点点结果吧,——今天写校内的搜索的一个功能时用到了——虽然感觉效率上并未得到提高,但也算是实践了一下——

       这个为string扩充的原型方法,使得string具备了使自己变成js的可访问的对象——如果格式符合要求的

//convert string to obj
String.prototype.format=function()
{
    return eval(this.toString());
};
这个扩充方法使得一个obj——如果符合格式的话——可以自序列化为DOM,可以改造得更好的,努力中
//convert obj to html obj
Object.prototype.init=function()
 {
    var _this=this;
    if(this.tag)
    {
        var tag=document.createElement(this.tag);
        if(this.innerHTML&&this.innerHTML!='')
        {
            tag.innerHTML=this.innerHTML;
        }else if(this.childNode)
        {
            if(this.childNode.tag)
            {
                tag.appendChild(this.childNode.init());
            }
            else{
                try{
                    for(var i in this.childNode)
                    {
                        if(this.childNode[i].tag)
                        {
                            tag.appendChild(this.childNode[i].init());
                        }
                    }
                }catch(e){
                    tag.appendChild(this.childNode);
                }
            }
        };
        if(this.id){tag.id=this.id;}
        if(this.type){tag.type=this.type;}
        if(this.src){tag.src=this.src;}
        if(this.alt){tag.alt=this.alt;}
        if(this.title){tag.title=this.title;}
        if(this.href){tag.href=this.href;}
        if(this.className){tag.className=this.className;}
        if(this.action&&this.evt){Gogo.__event_listener(tag,this.evt,this.action);}
        return tag;
    }
 }
 
下面定义了一个承载数据的模板
Gogo.sohust.temp=
        {
            tag:'li',
            childNode:
            {
                dd:
                {
                    tag:'dt',
                    className:'title',
                    innerHTML:'#'
                },
                dt:
                {
                    tag:'dt',
                    className:'text',
                    innerHTML:'#'
                },
                dt2:
                {
                    tag:'dt',
                    className:'link',
                    innerHTML:'#'
                },                
                cai:
                {
                    /*tag:'div',
                    className:'cai',
                    evt:'click',
                    action:'#',
                    innerHTML:'#'*/
                },
                ding:
                {
                    tag:'div',
                    className:'ding',
                    evt:'click',
                    action:'#',
                    title:'顶一下'
                }
            }
        };
当接收到数据,可以添加上去——其实这种工作就是以前后台脚本做的——
数据添加了,就可以调用init()方法将自己DOM化,并插入到documen中——
document.getElementById('i').appendChild(Gogo.sohust.temp.init());——
接下来继续努力——

类别:Js||添加到搜藏 |分享到i贴吧|浏览(117)|评论 (0)
 
最近读者:
 
网友评论:
发表评论:
姓 名:
网址或邮箱: (选填)
内 容:
     

   
帮助中心 | 空间客服 | 投诉中心 | 空间协议
©2012 Baidu