<divclass="Box"> <pid="myPanel"></p> <divclass="code"> <prestyle="padding:5px;background:#333;color:#fff;width:340px;"> <divid="div0"> <divid="div1">我是第一个div的内容<⁄div> <divid="div2"> <divid="div3">我是第二个div的内容<⁄div> <⁄div> <⁄div> </pre> </div> </div>
Ext.onReady(function(){ //6.4Ext.core.DomQuery单实例查询选择器,通过正则表达式查找DOM或者HTML //6.4.1compile()动态形成selector的查询函数 //console.info(Ext.core.DomQuery.compile("#myPanelBox")); //6.4.2filter()节点过滤器 //6.4.3is()是否包含该选择器的节点 //6.4.4jsSelect()之前的Ext.query实际上就是本函数的处理过程 //6.4.5selectNode()返回root中第一个匹配的selector选择器的元素 //DomQuery类的使用示例 varmyPanel=newExt.Panel({ title:'DomQuery类的使用示例',width:'350px',renderTo:'myPanel',html:'<divid="div0"><divid="div1">我是第一个div的内容</div><divid="div2"><divid="div3">我是第二个div的内容</div></div></div>' }); vartarArray=Ext.query("#div0div");//获取所有以id为div0为父节点的div varexcept=Ext.core.DomQuery.filter(tarArray,"#div1",true);//选择那些不包含id为div1的节点 varinclude=Ext.core.DomQuery.filter(tarArray,false);//选择那些包含id为div1的节点 varisInclude=Ext.core.DomQuery.is(except,"#div0");//对数组中是否包含指定id的节点进行判断 varselectNode=Ext.core.DomQuery.selectNode("#div0div");//选择id为div0下面的第一个div节点 console.info("filter:div1:true不包含div1的元素如下:");//[div#div2,div#div3] console.info(except); console.info("filter:div1:false包含div1的元素如下:");//[div#div1] console.info(include); console.info("是否包含指定id的节点:"+isInclude);//false console.info("第一个div节点如下:");//<divid="div1">我是第一个div的内容</div> console.info(selectNode); });