请问如何动态地设置一个element的属性（如width、height、title等）

Question

[code="js"]
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL='../ext-2.3.0/resources/images/default/s.gif';
new Ext.Panel({
id:'mypanel',
title : 'Ext.layout.BorderLayout布局示例',
layout:'border',// 边界布局
height : 300,
width : 400,
renderTo: 'panel',

        items: [
        {
            id:'up',
            title: 'north Panel',
            html : '上边',
            region: 'north',// 指定子面板所在区域为north

// height: 150,
collapsible:true,
split:true//拖拉边界改变区域大小
},
{
id:'down',
title: 'South Panel',
html : '下边',
region: 'south',// 指定子面板所在区域为south
// height: 150,
collapsible:true,
split:true,

            buttons:[{
                id:'bt1',
                text:'click',
                handler:change
            }]
        },{
            id:'left',
            title: 'West Panel',
            html : '左边',
            region:'west',// 指定子面板所在区域为west

// width: 200,
collapsible:true,
split:true
},{
id:'right',
title: 'east Panel',
html : '右边',
region:'east',// 指定子面板所在区域为east
// width: 200,
collapsible:true,
split:true
},{
id:'center',
title: 'Main Content',
html : '中间',
region:'center',// 指定子面板所在区域为center
collapsible:true,
split:true
}]
});
function change(){
var el = Ext.get('mypanel');
el.setWidth(800);
el.setWidth(600);
Ext.Msg.alert('提示',el.getWidth()+','+el.getHeight());
};
new Ext.ToolTip({
target: 'bt1',
html: 'Click the X to close me',
title: 'My Tip Title'
});
}
);
[/code]

上面的代码中，当点击按钮时，提示框显示“800,800”，但实际上浏览器中的mypanel却没有改变大小，反而整个面板都往左移动了。
还有，如果要在点击按钮的同时，也改变mypanel的title属性为“改变后的标题”，那么要如何编写代码呢？

Answer 1

[quote]var el = Ext.get('mypanel'); [/quote]
如果你的页面上有个document的id叫做mypanel, 可以这么做, 得到EXT封装后的element对象.

但是我看你的代码, 实际上是想得到自己在js中定义的panel对象.
那么, 就应该是:
[code="js"]
var el = Ext.getCmp('mypanel');
[/code]

得到了panel的对象后, 可以改变它的title
[code="js"]
setTitle( String title, [String iconCls] ) :
[/code]