首頁 > web前端 > js教程 > jquery類別數組是什麼?它是如何操作的?

jquery類別數組是什麼?它是如何操作的?

伊谢尔伦
發布: 2017-06-17 10:05:35
原創
1463 人瀏覽過

類別數組是什麼?

jQUery物件中有一個類別陣列的元素包裝集,該集合類似js中的陣列一樣擁有length屬性,因此我們稱此為類別數組。

在很多時候,JQuery的$()函數都會傳回一個類似資料的JQuery對象,例如$(‘div’)將傳回div裡面的所有div元素包裝的JQuery對象。在這種情況下,JQuery提供了幾個常用的屬性和方法來操作JQuery物件。

length:此屬性傳回JQuery裡包含的DOM元素的個數。

context:此屬性傳回取得該JQuery物件傳入context參數

JQuery:此屬性傳回JQuery的版本

each(fn(index)):該方法是是一個迭代器函數,它將使用fn函數迭代處理JQuery裡包含的每個元素。

get():此方法傳回由JQuery裡包含的所有DOM元素組成的陣列。

get(index):這個方法傳回JQuery裡包含的第index+1個DOM元素。

toArray():該將JQuery物件中包含的所有的DOM物件轉換成資料。

jQuery物件中的類別數組時如何進行操作的?

看看我們的jQuery為我們都提供了哪些可用的方法: 
  size():很明顯,它應該是返回包裝集中的元素個數,如$('a ').size()表示連結元素的個數; 

  get(index):當沒指定index時就預設取包裝集中所有元素,並以js中的陣列形式返回,如果指定了index ,則傳回下標為index對應的元素,如$('img[title]').get(0)傳回包含屬性title的第一個img元素,其也等效於$('img[title]' )[0]; 

  index(elem):在包裝集中返回元素elem所在的下標,如果沒找到該元素則回傳-1; 

  add(String|elem|Array ):把參數中的元素加入包裝集中,如果參數是jQuery選擇器,那麼將把所有符合的物件都加入集合中,如果是html元素那就透過clean方法得到的元素陣列加入集合中,如果是dom元素或dom元素數組,那就直接加入集合了;注意返回的是新增後的包裝集;如$('img[alt]','img[title]')等效於$('img[alt]').add('img[title]')即傳回包含了alt屬性的img元素或包含了title屬性的img元素; 
  not(String|elem|Array ):把包裝集中滿足參數條件的元素刪除,注意參數只能是篩選表達式,即以"["或":"開頭的表達式,如$( 'img[title]').not('title*=puy')即傳回包含title屬性的img元素,而這些元素的title屬性中包含有puy文字;傳回的是篩選之後的包裝集; 
filter(String|function):如果傳入的參數是String類型的話,那麼該表達式必須也是篩選表達式,用於從包裝集合中刪除所有與選擇器不匹配的元素;如果傳入的是一個函數的話,那麼包裝集中的每個元素都調用這個函數,若這個函數返回false則把這個元素從包裝集中刪除,而在函數中可以透過this關鍵字來調用當時包裝集中調用方法的元素;如$( 'td').filter(function(){return this.innerHTML.match(/^"d+$/)})返回td中的內容為數字的所有td元素; 
  slice(begin,end):創建並返回新的包裝集,該包裝集是原來包裝集的連續的一部分,且新包裝集的第一個元素是原包裝集中的begin位置的元素,而最後一個元素是end位置元素的前一元素,當然end可以不指定,那麼將延伸到原始包裝集的末尾;如$('*').slice(2,3)這個語句選擇頁面上的所有元素,然後生存包含原始包裝集的第三個元素的新包裝集,注意這個$('*').get(2)不同,這個返回的是元素,而slice方法返回的是包裝集,從而擁有包裝集的操作; 

#


  childen():傳回原始包裝集元素的所有不同子元素所組成的新包裝集(不包含文字節點),如$('div').children()傳回所有div元素下的由子元素所組成的新包裝集;如果指定了參數,那麼該參數也是篩選表達式; 
  contents():傳回原始包裝集元素的內容新包裝集(可以包含文字節點);注意此方法不能接受參數進行過濾; 
  next():返回原始包裝集元素的所有唯一的下一個兄弟元素所組成的新包裝集;如果指定了參數,那麼該參數也是篩選表達式;如$('div #someDiv').next()傳回包含id為someDiv的div元素的下一個兄弟元素的包裝集;如果指定了參數,那麼該參數也是篩選表達式; 
  nextAll():傳回包含原始包裝集元素的所有後續兄弟的新包裝集;如$('div#someDiv').nextAll()傳回包含id為someDiv的div元素的後面兄弟元素的新包裝集;如果指定了參數,那麼該參數也是篩選表達式; 


  parent():傳回原始包裝集所有元素的唯一直接父元素的新包裝集;如果指定了參數,那麼該參數也是篩選表達式; 
  parents( ):傳回原始包裝集所有元素的祖先元素的新包裝集;如果指定了參數,那麼該參數也是篩選表達式; 
  prev():傳回原始包裝集元素的所有唯一的上一個兄弟元素組成的新包裝集;如果指定了參數,那麼該參數也是篩選表達式; 

  prevAll():傳回包含原始包裝集元素的所有前面兄弟元素的新包裝集;如果指定了參數,那麼此參數也是篩選表達式; 
  siblings():傳回包含原始包裝集元素中的所有唯一兄弟元素所組成的新包裝集;如果指定了參數,那麼該參數也是篩選表達式; 
  find (String):傳回包含原始包裝集內與傳入的選擇器表達式相符的所有元素的新包裝集,原始包裝集的元素的後代也會被傳入新的包裝集; 
  contains (text):傳回包含text參數所傳入的文字字串的元素所組成的新包裝集; 
  is(String):如果包裝集中包含String符合的元素,則傳回true ,否則回傳false; 
  clone(copyHandle):如果傳入的參數為true,那麼會連帶事件一起拷貝,否則不拷貝事件,形成一個新的包裝集; 
  end():在jQuery命令鏈內調用,以便返回退到前一個包裝集; 
  andSelf():合併指令鏈內最近產生的兩個包裝集; 





############################################## ######################################################################

以上是jquery類別數組是什麼?它是如何操作的?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板