为 ExtJS 面板内的 HTML 元素执行 getElementById

Question

我需要从 ExtJS 面板中获取一个 HTML 元素并将其替换为另一个 HTML 元素。

我有一个普通的 ExtJS 面板 -> rptPanel，其内部HTML 被复制到另一个面板 -> outputDataPanel。

请参考下面的代码。

    var html = rptPanel.body.dom.innerHTML;

    me.outputDataPanel.insert(me.itemIndex,{
        html    : html,
        border  : 0,
        cls     : 'htmlView_font_higher htmlView_font',
        style   : 'margin: 10px 0px 20px 0px; width: 100%;'
    });

现在，我需要在 outputDataPanel 中获取一个 HTML 元素（类似于 outputDataPanel 上的 getElementById('table_data') ）并将其替换为另一个 HTML 元素.

有人可以帮忙吗？

Answer 1

您可以为该元素设置一个 ID 并像这样获取它：

// by id
var el = Ext.get("myDivId");
// by DOM element reference
var el = Ext.get(myDivElement);

// by id
var el = Ext.getDom('myDivId');
// by DOM element reference
var el = Ext.getDom(myDivElement);

替代方法是：

为该元素设置一个项目 ID，假设它是面板中的一个项目：

            {
                'text': 'myBTN',
                iconCls: 'sprite',
                disabled: true,
                itemId: 'btn1',
                handler: function(btn,e){
                    self.myFunction();
                }

            }

稍后在代码中查找 this.down("#btn1")

Answer 2

试试这个（我想这不是 Sencha 的最佳实践）：

outputDataPanel.getEl().down('#table_data')

为 ExtJS 面板内的 HTML 元素执行 getElementById

Do getElementById for an HTML element inside a ExtJS panel

html

javascript

extjs

extjs4