dom - ExtJS4-特定の要素の子孫であるすべてのコンポーネントを取得します

Question

特定のHTML要素の子孫としてレンダリングされるすべてのExtJSコンポーネントを見つけるための最も効率的な方法は何でしょうか？この要素はコンポーネント自体の一部ではなく、Extによって管理されることはなく、ハードコードされた生のHTMLであることに注意してください。また、この要素にはextコンポーネントだけでなく、他の非extマネージドhtmlも含まれている可能性があり、そのhtmlにはextコンポーネントも含まれている可能性があります。つまり、ソリューションは、直接の子を見るだけでなく、DOM全体を横断する必要があります。

Answer 1

私の提案Ext.getCmpは、ハッシュマップルックアップである、に対して各要素のIDをチェックしながら、domをウォークすることです。その後、メソッドのウォークに切り替えることもできますが、Component基本的には同じ速度になると思います。最初からdomを既に歩いている場合は、それを維持することをお勧めします。

var dom = ...;
var components = [];
Ext.Array.each(Ext.get(dom).query('*'), function(dom) {
  var cmp = Ext.getCmp(dom.id);
  if (cmp)
    components.push(cmp);
});

Ext.get(dom).query('*')あなたが望むより多くの仕事をするかもしれません、これのようにあなた自身の歩行者を持つことはより効率的かもしれません：

function walk(dom, callback) {
  if (dom.nodeType === 1) {
    callback(dom);
    Ext.Array.each(dom.childNodes, function(child) {
      walk(child, callback);
    });
  }
}
var dom = ...;
var components = [];
walk(dom, function(dom) {
  var cmp = Ext.getCmp(dom.id);
  if (cmp)
    components.push(cmp);
});

これはすべて、dom idがコンポーネントIDと一致することを前提としていますが、これがExtの将来のバージョンで信頼できるものであるかどうかはわかりません。