如何从ExtJs中的面板获取html内容

我是ExtJs新手。 我在获取面板html内容方面一直面临面板问题

xtype : 'panel',
id : 'first_block',
html : '<p>Hi this is belongs to first block.</p>',
listeners : {
    render : function(c) {
        c.body.on('click', function() {
            alert('' + this.id);
            alert(Ext.getCmp('first_block').items.getAt(0).getValue());
        });
}

xtype:'panel'，
id:“第一块”，
html:“您好，这是属于第一个块的。
”，
听众：{
渲染：函数（c）{
c、 body.on（'click'，function（）{
警报（“”+此.id）；
警报（Ext.getCmp（'first_block'）.items.getAt（0.getValue（））；
});
}

我没有得到html内容，但我得到的id像“第一块体”

---

提前感谢。

属性定义了组件内容中所需的html，在本例中为

Ext.Panel

Ext.Panel

s创建几层

div

s，以提供页眉、页脚、工具栏等功能

如果您只需要一个包含一些内容的

div

，那么您需要使用

Ext.Component

。Components没有

主体，因此代码中会有一些变化

xtype : 'component',
id : 'first_block',
html : '<p>Hi this is belongs to first block.</p>',
listeners : {
    render : function(c) {
        c.on('click', function() {
            alert('' + this.id);
            alert(this.el.dom.innerHTML);
        }, this);
}

xtype:'component'，
id:“第一块”，
html:“您好，这是属于第一个块的。
”，
听众：{
渲染：函数（c）{
c、 在（'单击'，函数（）上）{
警报（“”+此.id）；
警报（this.el.dom.innerHTML）；
}，这个）；
}

请注意，我在

调用上的

中添加了第三个参数，它指定了函数调用的
此
范围。我还编辑了您的警报以打印出元素的内部HTML，假设您正试图这样做

更新：

如果要在布局中使用此组件，它可能需要能够设置其
高度
和
宽度
，这意味着它需要为
box
类型，才能成为
Ext.BoxComponent
html
属性定义组件内容中所需的html，在本例中为<代码>外部面板

Ext.Panel

s创建几层

div

s，以提供页眉、页脚、工具栏等功能

如果您只需要一个包含一些内容的

div

，那么您需要使用

Ext.Component

。Components没有

主体，因此代码中会有一些变化

xtype : 'component',
id : 'first_block',
html : '<p>Hi this is belongs to first block.</p>',
listeners : {
    render : function(c) {
        c.on('click', function() {
            alert('' + this.id);
            alert(this.el.dom.innerHTML);
        }, this);
}

xtype:'component'，
id:“第一块”，
html:“您好，这是属于第一个块的。
”，
听众：{
渲染：函数（c）{
c、 在（'单击'，函数（）上）{
警报（“”+此.id）；
警报（this.el.dom.innerHTML）；
}，这个）；
}

请注意，我在

调用上的

中添加了第三个参数，它指定了函数调用的
此
范围。我还编辑了您的警报以打印出元素的内部HTML，假设您正试图这样做

更新：

如果要在布局中使用此组件，它可能需要能够设置其
高度和
宽度，这意味着它需要是
box
类型才能成为
Ext.BoxComponent
Ext.getElementById（'yourId'）。innerHTML
Ext.getElementById（'yourId'）。innerHTML