怎么把extjs 的TabPanel加入到自定义的div中

我自己在主页面jsp上布局了格式，想把他的TabPanel加到自己定义的div中。给出详细代码！谢谢

 Ext.onReady(function(){  
    var centerRegion = new Ext.TabPanel({  

        region : 'center',  
        margins : '3 3 3 0',//距离top、right、bottom、left边界的距离,单位为像素  
        activeTab : 0,  
        defaults : {  
            autoScroll : true  
        },  
        items : [{  
            title : '主页',  
            html : '内容'  
        }]  
    });  
    centerRegion.render('con');
    var westRegion = new Ext.Panel({  
        title : '导航',  
        region : 'west',  
        split : true,  
        width : 200,  
        //True表示为面板是可收缩的，并自动渲染一个展开/收缩的轮换按钮在头部工具条  
        collapsible : true,  
        margins : '3 0 3 3',  
        cmargins : '3 3 3 3',  
        layout : 'accordion',  
        layoutConfig : {  
            titleCollapse : true,//单击标题就可以折叠面板  
            animate : true,//展开的效果  
            activeOnTop : true//是否可以改变顺序  
        },  
        items : []  
    });  

    new Ext.Viewport({  
        layout : 'border',   
        items : [{
            region : 'north',
            height : 100,
            title : '顶部面板'
        },
        {
            region : 'south',
            height : 30,
            title : '底部面板'
        },
        westRegion,
        centerRegion]  
    });  
});

以上是extjs的布局页面我只想要他的TabPanel控件，其余都不要

主要就是用renderTo指向div的id就可以了

        Ext.onReady(function() { 
            var tabPanel = new Ext.TabPanel({
            renderTo: "div_tab",
            activeTab: 0,
            items: [{
              title: 'Tab 1',
              html: 'A simple tab'
            },{
              title: 'Tab 2',
              html: 'Another one'
            }]
        });
       });

    <body>
    <div id="div_tab" style="background: #D97E27; width:800px;height:500px;">

    </div>
</body>

直接render到你的div里面就好了，其他代码删除

 <div id="myPanel"></div>
<script>
Ext.onReady(function(){  
    var centerRegion = new Ext.TabPanel({  height:400,
        region : 'center',  
        margins : '3 3 3 0',//距离top、right、bottom、left边界的距离,单位为像素  
        activeTab : 0,  
        defaults : {  
            autoScroll : true  
        },  
        items : [{  
            title : '主页',  
            html : '内容'  
        }]  
    });  
  centerRegion.render('myPanel');
});
</script>

刚发的代码有问题
<!DOCTYPE html>

Ext.onReady(function() { var tabPanel = new Ext.TabPanel({ renderTo: "div_tab", activeTab: 0, items: [{ title: 'Tab 1', html: 'A simple tab' },{ title: 'Tab 2', html: 'Another one' }] }); });

    </div>
</body>