想知道“jquery物件轉換為dom物件時候的[0]屬性是哪裡來的”,首先必須知道使用jquery查詢後的物件到底包含哪些內容;
我們以$("#test")為例,當文件中有id為test的元素時,使用$("#test")最終結果如下:
可以從控制檯中看出,像是一個數組,但是,當進行型別檢測時,結果如下:
其實結果是一個“類陣列”。對於什麼是類陣列,可自行百度;
可以看出,查詢結果的物件有個“0”屬性,儲存著實際的dom元素物件;為何是這樣呢,其實可以從jquery原始碼中得知:
當執行$("#test")時,會走到如上圖程式碼,首先使用原生“document.getElementById("test")”查詢實際dom元素,如果找到了,就會將查詢到的dom元素儲存到“this[0]”中,而this則是一個例項化的物件;然後賦值this.context與this.selector,最終將this返回,也就是我們最終的查詢結果;
所以,由上可知,在jquery原始碼中,其實就是將查詢到的dom元素儲存到返回物件的[0]屬性中,也就回答了它具體是從哪兒來的了。
想知道“jquery物件轉換為dom物件時候的[0]屬性是哪裡來的”,首先必須知道使用jquery查詢後的物件到底包含哪些內容;
我們以$("#test")為例,當文件中有id為test的元素時,使用$("#test")最終結果如下:
可以從控制檯中看出,像是一個數組,但是,當進行型別檢測時,結果如下:
其實結果是一個“類陣列”。對於什麼是類陣列,可自行百度;
可以看出,查詢結果的物件有個“0”屬性,儲存著實際的dom元素物件;為何是這樣呢,其實可以從jquery原始碼中得知:
當執行$("#test")時,會走到如上圖程式碼,首先使用原生“document.getElementById("test")”查詢實際dom元素,如果找到了,就會將查詢到的dom元素儲存到“this[0]”中,而this則是一個例項化的物件;然後賦值this.context與this.selector,最終將this返回,也就是我們最終的查詢結果;
所以,由上可知,在jquery原始碼中,其實就是將查詢到的dom元素儲存到返回物件的[0]屬性中,也就回答了它具體是從哪兒來的了。