第十五講：ExtJS常用工具類和函數(下)

Ext.DomQuery

示例一：簡單的應用

Ext.onReady(function(){

var divs = Ext.query("div");

Ext.each(divs,function(item,index,allItems){

alert(item.innerHTML);

})

});

 

Ext.onReady(function(){

var divs = Ext.DomQuery.select("div");

Ext.each(divs,function(item,index,allItems){

alert(item.innerHTML);

})

});

 

filter( Array el, String selector, Boolean nonMatches ) : Array

過濾el中的元素,保留符合selector的，如果nonMatches爲真，結果相反。

實例二：選擇符合selector的元素。

Ext.onReady(function(){

var divs = Ext.DomQuery.select("div");

var includes = Ext.DomQuery.filter(divs,"#test1");

Ext.each(includes,function(item,index,allItems){

alert(item.innerHTML);

})

});

 

示例三：選擇不符合selector的元素。

Ext.onReady(function(){

var divs = Ext.DomQuery.select("div");

var includes = Ext.DomQuery.filter(divs,"#test1",true);

Ext.each(includes,function(item,index,allItems){

alert(item.innerHTML);

})

});

 

is( String/HTMLElement/Array el, String selector ) : Boolean

驗證el是否匹配selector。

示例四：String類型的el，進行匹配。

Ext.onReady(function(){

alert(Ext.DomQuery.is("test1","#test1"));

alert(Ext.DomQuery.is("test1","#test2"));

alert(Ext.DomQuery.is("test1","#test3"));

alert(Ext.DomQuery.is("test1","#test4"));

alert(Ext.DomQuery.is("test1","#test5"));

});

 

示例五：HTMLElement類型的el，進行匹配。

Ext.onReady(function(){

alert(Ext.DomQuery.is(Ext.getDom("test1"),"#test1"));

alert(Ext.DomQuery.is(Ext.getDom("test1"),"#test2"));

alert(Ext.DomQuery.is(Ext.getDom("test1"),"#test3"));

alert(Ext.DomQuery.is(Ext.getDom("test1"),"#test4"));

alert(Ext.DomQuery.is(Ext.getDom("test1"),"#test5"));

});

 

示例六：Array類型的el，進行匹配。

Ext.onReady(function(){

var divs = Ext.query("div");

alert(Ext.DomQuery.is(divs,"div"));

alert(Ext.DomQuery.is(divs,"#test1"));

 

var includes = Ext.DomQuery.filter(divs,"#test1");

alert(Ext.DomQuery.is(includes,"#test1"));

 

var excepts = Ext.DomQuery.filter(divs,"#test1",true);

alert(Ext.DomQuery.is(excepts,"#test1"));

 

});

select( String selector, [Node root] ) : Array

從root中選擇匹配selector的對象數組

示例七：選擇指定ID下的匹配selector的對象數組

Ext.onReady(function(){

var divs = Ext.query("div","test1");

Ext.each(divs,function(item,index,allItems){

alert(item.innerHTML);

})

 

var divs2 = Ext.query("div","test2");

Ext.each(divs2,function(item,index,allItems){

alert(item.innerHTML);

})

});

 

selectNode( String selector, [Node root] ) : Element

返回root中第一個匹配selector的對象

Ext.onReady(function(){

var divs = Ext.DomQuery.selectNode("div","test1");

Ext.each(divs,function(item,index,allItems){

alert(item.innerHTML);

})

});