怎样在Extjs框架中嵌入html

用html属性

{bodyStyle:'background:#069color:#FFFfont-size:12pxpadding-top:12px',html:'欢迎您！管理员'}

完整案例：

var hd={//这个就是上

region:'north',

height:40,

bodyStyle:'background:#069color:#FFFfont-size:12pxpadding-top:12px',

html:'欢迎您！管理员'

}

var mainMenu={

id:'menu_panel',

region:'west',

title:'功能菜单',

iconCls:'icon_menu',

split:true,

width:135,

minSize:100,

maxSize:250,

margins:'2 0 5 5',

cmargins:'2 5 5 5',

collapsible:true,

bodyBorder:false,

bodyStyle:'background-color:#DFE8F6',

layout:{type:'accordion',animate:false},

defaults:{border:false,bodyStyle:'padding:0px'},

items:[]

}

var modulePanel={

id:'module_panel',

region:'center',

border:false,

layout:'card',

margins:'2 5 5 0',

cmargins:'2 5 5 5',

activeItem:0,

items:[

{title:'欢迎进入管理系统 V1.0',id:'dashboard',

html:'内容区'

}]

}

var viewport=new Ext.Viewport({

layout:'border',

items:[hd,mainMenu,modulePanel]

})

viewport.doLayout()

html只接受字符串, 不接受Ext.Component或Element或原生DOM对象, 但可以是调用方法返回的字符串. 也可以是function字面量调用, function(){...}()这样.

为item指定id属性, 使用原生方法修改DOM对象innerHTML, document.getElementById(id), 任何位置都可调用. 不过有浏览器兼容性问题.

如果只是要生成div的化完全可以使用Ext.Panel代替, 在任意位置都可以调用_window.add/remove增减items, 之后需要调用_window.render方法重新render

---