JavaScript類數組對象參考

來源:互聯網
上載者:User

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) //查詢類是否存在

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.