Extjs学习笔记--（六，选择器）
文档对象dom是javascript与页面元素的桥梁
选择器的作用就是通过元素的标签名，属性名，css属性名对页面进行快速，准确的定位及选择
Extjs的选择器：Ext.DomQuery
Ext.query(path[,root,type])
path：查询要使用的选择符，或xpath
root：查询开始的节点或节点id。如果不设置，默认为document对象，为了提高速度，不要使用document开始查询
type：查询的类型，值可以为select和simple，当值为simple时使用id或标签属性值等座简单的查询
demo：
var el=Ext.get(rootId); //rootId为节点id
el.query(path);
Ext.get Ext.get()可接收这几种类型的参数，如HTMLElement，Ext.Element、字符型， 返回的新实例。以下三种类型如下例： var el1 = Ext.get(‘elId‘); // 接收元素id var el2 = Ext.get(el1); // 接受Ext.Element var el3 = Ext.get(el1.dom); //接受HTMLElement Ext.fly Ext.fly在参数方面与Ext.get的完全相同，但其内置控制返回Ext.Element 的方法就完全不同，Ext.fly从不保存享元对象的引用，每次调用方法都返回 独立的享元对象。其实区别在于“缓存”中，因为缓存的缘故，Ext.get需要 为每个元素保存其引用，就形成了缓存，如果有相同的调用就返回，但 Ext.fly没有所谓的缓存机制，得到什么就返回什么，不是多次使用的情况下 “一次性地”使用该元素就应该使用Ext.fly（例如执行单项的任务）。 使用Ext.fly的例子： // 引用该元素一次即可，搞掂了就完工 Ext.fly(‘elId‘).hide();
全选功能
Ext.fly("selectAll").on("click",function(e,el){
var els=Ext.query("input[name=articleId]");
for(var i=0;ln=els.length,i<ln;i++){
els[i].checked=el.checked;
}
})
Ext.Query是Ext.DomQuery.select的简写形式
基本选择符
1：*:选择任何元素 Ext.qurey("*")
2: E：根据元素标记E选择元素 Ext.query("E") //E为元素标记，input，div
3: E F：选择包含在标记E中的标记F Ext.query("E F") //E，F均为元素标记
4： E>F：选择包含在标记E中的直接子标记F Ext.query("E>F") //E，F均为元素标记
5: E+F:选择所有紧接在元素E后的元素F Ext.query("E+F")
6: E~F:选择在元素E之后同层的元素F Ext.query("E~F")
7: #ID ：选择id属性值为ID的元素 Ext.query("#ID")
8：.classname:选择css类名为classname的元素 Ext.query("E .classname") //E为元素标记，className为css类名
属性选择符
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
