JavaScript和DOM中有很多類數組對象,它們有以下特點
1、有length屬性
2、可以使用[]通過下標訪問
3、部分類數組對象使用[]訪問成員時不只可以使用下標,還可以使用id或name
4、既然滿足了1、2條件,當然也可以通過for迴圈來遍曆
但正如其名字,它們只是類似數組,而不是數組,並不能使用數組的特有方法,如slice、push、pop等。不過如果確實需要它們像數組一樣工作,可以使用Array.prototype.slice(類數組對象, 0)來產生一個數組。產生的數組也就失去了原有類數組對象所特有的方法和[]使用name來訪問的特性
下面是一些類數組對象的介紹
一、Arguments
arguments是最常見的類數組對象,在函數內部使用,arguments[0]或functionName.arguments[0]
成員介紹
屬性length //長度callee //正在執行的函數
二、NodeList
以下代碼形式傳回型別為NodeList
childNodes
labels(select元素)
getElementsByName(name)
getElementsByClassName(className)
getElementsByTagName(tagName)
getElementsByTagNameNS(namespaceURI, tagName)
querySelectorAll(selectors)document.all.tags(tagName)
成員介紹
屬性length //長度方法item(idx) //訪問成員,支援下標、元素id
三、StyleSheetList
以下代碼形式傳回型別為NodeList
document.styleSheets
成員介紹
屬性length //長度方法item(idx) //訪問成員,支援下標、元素id、元素name
四、HTMLCollection
以下代碼形式傳回型別為HTMLCollection
children
document.images //所有img元素
document.links //所有帶href屬性的a元素和area元素
document.anchors //所有帶name屬性的a元素
document.forms //所有form元素
document.scripts //所有script元素
document.applets //所有applet元素
document.embeds //所有embed元素
document.plugins //document.與embeds相同
tBodies(table元素)
rows(table、tbody、thead、tfoot元素)
cells(tr元素)
areas(map元素)
成員介紹
屬性length //長度方法item(idx) //訪問成員,支援下標、元素id、元素namenamedItem(name) //訪問成員,支援元素id、元素name
五、HTMLFormControlsCollection (繼承HTMLCollection)
以下代碼形式傳回型別為HTMLFormControlsCollection
elements(form元素)
成員介紹
屬性length //長度方法item(idx) //訪問成員,支援下標、元素id、元素namenamedItem(name) //訪問成員,支援元素id、元素name
六、HTMLOptionsCollection(繼承HTMLCollection)
以下代碼形式傳回型別為HTMLFormControlsCollection
options(select元素)
成員介紹
屬性length //長度selectedIndex //當前選中option的下標方法item(idx) //訪問成員,支援下標、元素id、元素namenamedItem(name) //訪問成員,支援元素id、元素nameadd(option, beforeIndex) //添加optionremove(index) //刪除option
七、HTMLAllCollection
以下代碼形式傳回型別為HTMLFormControlsCollection
document.all
成員介紹
屬性length //長度方法item(idx) //訪問成員,支援下標、元素id、元素namenamedItem(name) //訪問成員,支援元素id、元素nametags(tagName) //返回特定標籤名稱的NodeLi
八、DOMTokenList
這是HTML5中的一個新特性,目的是為瞭解決className設定或刪除類時涉及多個類時操作複雜的問題。
以下代碼形式傳回型別為DOMTokenList
classList(屬於元素)
成員介紹
屬性length //長度方法item(index) //訪問成員,使用下標add(idx) //添加類remove(className) //刪除類toggle(className) //存在類則刪除,不存在則添加contains(className) //查詢類是否存在