为什么得到了3个容器的id啊

html 文件代码：

 

<div id="north">north north north north north north north north north north</div>
  <div id="south">south south south south south south south south south south</div>
  <div id="center">center center center center center center center center center</div>

 

js代码：

 

new Ext.BoxComponent({
region:'north',
el:'north',
height:"40"
})

 

 

结果在页面上显示3个div的内容，这是为什么？

页面图如下面的附件中显示。

 

 

问题补充：
一楼的朋友，谢谢你给我的建议，但是，我的html页面中必须有多个容器，纵不能为了得到一个id把其他的全部删除吧，我就是要得到其中的north,应该这么做啊？
我想知道，el:xxx,  这个属性的全称是什么啊？

[code="js"]new Ext.ViewPort({
layout: 'border',
items: [{
region: 'north',
xtype: 'box',
applyTo: 'north',
height: "40"
},
{
xtype: 'panel',
regon: 'center',
contentEl:'center'
},
{
xtype: 'panel'
region: 'south',
contentEl:'south'
}]
});[/code]

el = element

这两行你可以删除掉

[code="js"]new Ext.ViewPort({
layout: 'border',
items: [{
region: 'north',
xtype: 'box',
applyTo: 'north',
height: "40"
},
{
xtype: 'panel',
regon: 'center',
html: 'center center center center center center center center center' //或者 contentEl:'center'
},
{
xtype: 'panel'
region: 'south',
html: 'south south south south south south south south south south' //或者 contentEl:'south'
}]
});[/code]