第十五讲：ExtJS常用工具类和函数(下)

今天药忘吃喽~ 2022-04-11 14:44 147阅读 0赞

Ext.DomQuery

示例一：简单的应用

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

过滤el中的元素,保留符合selector的，如果nonMatches为真，结果相反。

实例二：选择符合selector的元素。

示例三：选择不符合selector的元素。

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

验证el是否匹配selector。

示例四：String类型的el，进行匹配。

<table style="width:426.1pt;"> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:426.1pt;"> 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")); }); &nbsp; </td> 
 </tr> 
 </tbody> 
</table>

示例五：HTMLElement类型的el，进行匹配。

<table style="width:426.1pt;"> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:426.1pt;"> 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")); }); &nbsp; </td> 
 </tr> 
 </tbody> 
</table>

示例六：Array类型的el，进行匹配。

<table style="width:426.1pt;"> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:426.1pt;"> Ext.onReady(function(){ var&nbsp;divs = Ext.query("div"); alert(Ext.DomQuery.is(divs,"div")); alert(Ext.DomQuery.is(divs,"#test1")); &nbsp; var&nbsp;includes = Ext.DomQuery.filter(divs,"#test1"); alert(Ext.DomQuery.is(includes,"#test1")); &nbsp; var&nbsp;excepts = Ext.DomQuery.filter(divs,"#test1",true); alert(Ext.DomQuery.is(excepts,"#test1")); &nbsp; }); </td> 
 </tr> 
 </tbody> 
</table>

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

从root中选择匹配selector的对象数组

示例七：选择指定ID下的匹配selector的对象数组

<table style="width:426.1pt;"> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:426.1pt;"> Ext.onReady(function(){ var&nbsp;divs = Ext.query("div","test1"); Ext.each(divs,function(item,index,allItems){ alert(item.innerHTML); }) &nbsp; var&nbsp;divs2 = Ext.query("div","test2"); Ext.each(divs2,function(item,index,allItems){ alert(item.innerHTML); }) }); &nbsp; </td> 
 </tr> 
 </tbody> 
</table>

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

返回root中第一个匹配selector的对象