ExtJs007最常用的查询方法

Ext.onReady(function () {
     
    Ext.create('Ext.panel.Panel', {
        title: '我的面板',
         '100%',
        height: 400,
        renderTo: Ext.getBody(),
        html: '<div id=d1><span id=sp>我是sp的内容</span><div id=d2>我是d2的内容</div></div><input id=inp value=123 /><form id=f1><input name=uname value=bhx /><input name=pwd value=123 /></form>'
    });
    //查询系最常用的方法:
    //Ext.dom.Element   get  fly   getDom
      
    var d1 = Ext.get('d1');//都是id
    var sp = Ext.get('sp');

    //查询系方法：
     
    //1: contains：判断元素是否包含另一个元素
    //alert(d1.contains(sp));
    //alert(d1.contains('sp'));

    //2: child：从元素的直接子元素中选择与选择符匹配的元素 (返回的只是一个元素，并不能返回数组) ,2个参数 第二个参数是可选的 如果为true表示取得的是原生的HTMLElement元素
    //获得第一个子元素
    //var ch1 = d1.child('span');
    //alert(ch1.dom.innerHTML);

    //var ch2 = d1.child('span', true);//HTMLElement，取得的是原生的HTMLElement元素
    //alert(ch2.innerHTML);

    //3: down：选择与选择符匹配的元素的子元素//findParentNode、up：查找与简单选择符匹配的元素的父元素
   
    //    var ch1 = d1.down('#d2');
    //    alert(ch1.dom.innerHTML);

    //4: first：选择元素第一个子元素 //last：选择元素的最后一个子元素
    //    var f1 = d1.first('div');
    //    alert(f1.dom.innerHTML);

    //21:49
    //5: findParent：查找与简单选择符匹配的元素的父元素 //parent：返回元素的父元素
      
    //var parent = sp.findParent('div');
    //alert(parent.innerHTML);

    //6: is：判断元素是否匹配选择符
    //alert(d1.is('div'));//判断是不是div选择器

    //7: next：选择元素同层的下一个元素 //prew：选择元素同层的上一个元素
    //var next = sp.next();
    //alert(next.dom.nodeName);

    //8: Ext.query：根据选择符获取元素  (Ext.dom.Element.query)

    //参数：要查找的元素，从哪个元素id下查找
    var arr = Ext.query("span","d1");
    Ext.Array.each(arr, function (item) {
        alert(item.innerHTML);
    });

    //9: Ext.select/Ext.dom.Element.select：根据选择符获取元素集合
    // 返回的都是元素集合: Ext.dom.CompositeElementLite(HTMLElemennt)/Ext.dom.CompositeElement(Ext.dom.Element)
    // 参数说明： 3个参数 ， 
    //    1：selector 选择器  (不要使用id选择器)
    //  2：返回的集合对象（boolean false:Ext.dom.CompositeElementLite true:Ext.dom.CompositeElement）
    //  3: 指定的根节点开始查找

    //    var list1 = Ext.select('span',false,'d1');//Ext.dom.CompositeElementLite
    //    Ext.Array.each(list1.elements,function(el){
    //            alert(el.innerHTML);
    //    });
    //    var list2 = Ext.select('span',true,'d1');//Ext.dom.CompositeElement
    //    Ext.Array.each(list2.elements,function(el){
    //            alert(el.dom.innerHTML);
    //    });    
     

});