文檔對象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類名
屬性選擇符
1.[attribute]:選擇帶有屬性attribute的元素
語法：
Ext.query("[attribute]")
Ext.query("E[attribute]")
2.[attribute=value];選擇attribute的屬性元素為value的元素
Ext.query("[attribute=value]")
Ext.query("E[attribute=value]")
3.[attribute^=value]:選擇attribute的屬性以value開頭的元素
Ext.query("[attribute^=value]")
Ext.query("E[attribute^=value]")
4.[attribute$=value]:選擇attribute的屬性以value結尾的元素
Ext.query("[attribute$=value]")
Ext.query("E[attribute$=value]")
5.[attribute*=value]:選擇attribute的屬性值包含value的元素
Ext.query("[attribute*=value]")
Ext.query("E[attribute*=value]")
6,[attribute%=value]:選擇attribute的屬性值能整除value的元素
Ext.query("[attribute%=value]")
Ext.query("E[attribute%=value]")
7.[attribute!=value]:選擇attribute的屬性值不等於value的元素
Ext.query("[attribute!=value]")
Ext.query("E[attribute!=value]")
Css屬性值選擇器
和屬性選擇符類似
不同之處：
1,使用{}代替屬性選擇符中的[]
2,不要使用沒有屬性值的語法，如：Ext.qurey("input{display}"),原因-css屬性和元素屬性不同，一直是存在的，所以使用Ext.qurey("input")的結果是一樣的
3，經過compile方法變異后的屬性函數中，byAttribute方法調用的custom參數值為‘{’
4，在byAttribute方法中，會調用DomQurey對象的getStyle方法獲取css屬性值
5，注意padding，background等可以合並定義的css屬性，查詢時必須拆分成單一的屬性
如padding-left,padding-right,或background-color
偽類選擇符
1,E:first-child：選擇元素E，且其為父節點的第一個子節點
Ext.query("E:first-child") 如： Ext.query("input:first-child")
2，E:last-child：選擇元素E，且其為父節點的最后一個子節點
Ext.query("E:last-child") 如： Ext.query("input:last-child")
3,E:nth-child(n) :選擇標記為E，且其為父節點的第N（N>=1）個子節點
Ext.query("E:nth-child(n)") 如：Ext.query("input:nth-child(10)")
4.E:nth-child(odd)或：E:odd 選擇標記為E，且其為父節點的 奇數子節點的元素
Ext.qurey("E:nth-child(odd)")如：Ext.qurey("input:nth-child(odd)")
5.E:nth-child(even)或：E:even 選擇標記為E，且其為父節點的 偶數子節點的元素
Ext.qurey("E:nth-child(even)")如：Ext.qurey("input:nth-child(even)")
6.E:only-child 選擇標記其為父節點的唯一子節點的元素
Ext.qurey("E:only-child ")如：Ext.qurey("input:E:only-child ")
7.E:checked 選擇標記為E，且其checked屬性為true的元素
Ext.qurey("E:checked")
8.E:first 選擇標記為E，的第一個元素
Ext.qurey("E:first ")
9.E:last 選擇標記為E的最后一個元素
Ext.qurey("E:checked")
10.E：nth(n) 標記為E的元素集合中的第n個元素
Ext.qurey("E：nth(n)")
11.E:contains(str) 選取標記為E，且其innerHtml屬性值包含str的元素