ExtJS équivalent des enfants de JQuery?

Question

J'ai essayé d'implémenter la fonction enfants dans ExtJS en utilisant select ("~ *"), ça ne fonctionnait pas bien. Je veux juste que ExtJS me renvoie un ensemble de nœud enfant immédiat et ignore tous les nœuds sous les nœuds enfants.

<div> 
    <span> 
     <img/> 
     <img/> 
    </span> 
    <span> 
     <img/> 
     <img/> 
    </span> 
    <span> 
     <img/> 
     <img/> 
    </span> 
</div> 

En fait, je veux juste le nombre d'enfants immédiats. Si je reçois le droit de sélection, je peux faire un getCount() sur le CompositeElement.

Toute aide sera grandement appréciée.

Cheers, Mickey

Answer 1

Si vous pouvez id parent, alors vous pourriez faire quelque chose comme ça pour amener les enfants:

<div id='mydiv'> 
    <span> 
     <img/> 
     <img/> 
    </span> 
    <span> 
     <img/> 
     <img/> 
    </span> 
    <span> 
     <img/> 
     <img/> 
    </span> 
</div> 

Définissez une fonction comme celle-ci:

function getChildren(parentId) { 
     var kids = Ext.get(parentId).select('*'); 
     kids = kids.filter(function(el) { 
      return el.parent().id == parentId 
     }); 
     return kids; 
    }  

Dans votre exemple, getChildren('mydiv').getCount() retournera 3.

Answer 2

Peut-être que vous pourriez fournir une représentation des éléments DOM désirés qui seraient sélectionnés, mais, si je comprends bien votre question, je pense que vous voulez utiliser Ext.Element. De Ext.CompositeElement, vous avez accès à toutes les méthodes de Ext.Element. En utilisant Ext.Element.select, Ext.Element.parent, Ext.Element.query, Ext.Element.next, et ainsi de suite, vous devriez avoir accès à tout élément que vous voulez.

Voir: http://www.extjs.com/deploy/dev/docs/source/Element.fx.html#cls-Ext.Element

Servus,

-bn

Answer 3

J'ai essayé la mise en œuvre de la fonction des enfants à l'aide ExtJS select ("~ *"), juste na pas bien.

Je crois que ce que vous cherchez est "> *". En ExtJs vous pouvez faire:

var children = Ext.get("myDiv").query("> *"); 

avec

<div id='mydiv'> 
    <span> 
     <img/> 
     <img/> 
    </span> 
    <span> 
     <img/> 
     <img/> 
    </span> 
    <span> 
     <img/> 
     <img/> 
    </span> 
</div> 

Les enfants variables seront désormais un tableau de HTMLElements descendants directs (dans ce cas 3 travées).

Answer 4

Si vous voulez juste pour obtenir le nombre d'enfants, vous pouvez simplement utiliser

Ext.select('div span').getCount(); 

Il retourne 3 dans votre exemple.