ExtJs007最常用的查询方法
1 Ext.onReady(function () { 2 3 Ext.create('Ext.panel.Panel', { 4 title: '我的面板', 5 width: '100%', 6 height: 400, 7 renderTo: Ext.getBody(), 8 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>' 9 }); 10 //查询系最常用的方法: 11 //Ext.dom.Element get fly getDom 12 13 var d1 = Ext.get('d1');//都是id 14 var sp = Ext.get('sp'); 15 16 //查询系方法: 17 18 //1: contains:判断元素是否包含另一个元素 19 //alert(d1.contains(sp)); 20 //alert(d1.contains('sp')); 21 22 //2: child:从元素的直接子元素中选择与选择符匹配的元素 (返回的只是一个元素,并不能返回数组) ,2个参数 第二个参数是可选的 如果为true表示取得的是原生的HTMLElement元素 23 //获得第一个子元素 24 //var ch1 = d1.child('span'); 25 //alert(ch1.dom.innerHTML); 26 27 //var ch2 = d1.child('span', true);//HTMLElement,取得的是原生的HTMLElement元素 28 //alert(ch2.innerHTML); 29 30 //3: down:选择与选择符匹配的元素的子元素//findParentNode、up:查找与简单选择符匹配的元素的父元素 31 32 // var ch1 = d1.down('#d2'); 33 // alert(ch1.dom.innerHTML); 34 35 //4: first:选择元素第一个子元素 //last:选择元素的最后一个子元素 36 // var f1 = d1.first('div'); 37 // alert(f1.dom.innerHTML); 38 39 //21:49 40 //5: findParent:查找与简单选择符匹配的元素的父元素 //parent:返回元素的父元素 41 42 //var parent = sp.findParent('div'); 43 //alert(parent.innerHTML); 44 45 //6: is:判断元素是否匹配选择符 46 //alert(d1.is('div'));//判断是不是div选择器 47 48 //7: next:选择元素同层的下一个元素 //prew:选择元素同层的上一个元素 49 //var next = sp.next(); 50 //alert(next.dom.nodeName); 51 52 //8: Ext.query:根据选择符获取元素 (Ext.dom.Element.query) 53 54 //参数:要查找的元素,从哪个元素id下查找 55 var arr = Ext.query("span","d1"); 56 Ext.Array.each(arr, function (item) { 57 alert(item.innerHTML); 58 }); 59 60 //9: Ext.select/Ext.dom.Element.select:根据选择符获取元素集合 61 // 返回的都是元素集合: Ext.dom.CompositeElementLite(HTMLElemennt)/Ext.dom.CompositeElement(Ext.dom.Element) 62 // 参数说明: 3个参数 , 63 // 1:selector 选择器 (不要使用id选择器) 64 // 2:返回的集合对象(boolean false:Ext.dom.CompositeElementLite true:Ext.dom.CompositeElement) 65 // 3: 指定的根节点开始查找 66 67 // var list1 = Ext.select('span',false,'d1');//Ext.dom.CompositeElementLite 68 // Ext.Array.each(list1.elements,function(el){ 69 // alert(el.innerHTML); 70 // }); 71 // var list2 = Ext.select('span',true,'d1');//Ext.dom.CompositeElement 72 // Ext.Array.each(list2.elements,function(el){ 73 // alert(el.dom.innerHTML); 74 // }); 75 76 77 });