EXtjs 创建元素

Extjs创建元素

Ext.DomHelper.createHtml

//生成html
// tag :对象 cls:className html：内部html cn：孩子节点
        var domHtml=Ext.DomHelper.createHtml({tag:"input",type:"radio",value:'1',attr:"data:1;color:red"});
        console.info(domHtml);

        var domHtml2=Ext.DomHelper.createHtml([{
            tag:"a",cls:"titlebar",html:"报表"
        },{
            cn:[{tag:"p",cn:[
                 {tag:"a",html:"月份"},
                 {tag:"a",html:"年份"}
                 ]}] }]); 

创建模板

//首先通过DomHelper.createTemplate创建一套模板 
        var test = Ext.DomHelper.createTemplate('<div name="{id}">'+  
            '<span class="{cls}">{name:trim} {value:ellipsis(10)}<br>模板</span>'+  
            '</div>');  
        //通过定义的模板替换模板中的变量,然后追加在div的id为div1的div里面进行展现 
        test.append(Ext.get("template"),{id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'},true); 

插入html代码

     //insertHtml(where ,el, html)
        // beforeBegin 开始标签之情，afterBegin开始标签之后
        //el htmlElement
        // html
       //insertFirst insertAfter overview 替换原来的元素
        Ext.DomHelper.insertBefore(Ext.get("insertBefore"),"<div>before</div>");

修改元素

Ext.DomHelper.applyStyles(Ext.fly(“style”),”color:red”);

元素集合

//Ext.select(selector,unique,root) 获取元素集合 //unique false CompositeElementLite htmlElement //unique ture conpositeElement element