Document:getElementsByName()使用方法及示例
更新時間：2013年10月28日 15:29:10 作者：
Document:getElementsByName()想必大家對它并不陌生吧，主要是根據(jù)名稱獲取元素，下面是其具體的使用方法及范例，感興趣的朋友不要錯過
定義和用法
getElementsByName() 方法可返回帶有指定名稱的對象的集合。
語法document.getElementsByName(name)
該方法與 getElementById() 方法相似，但是它查詢元素的 name 屬性，而不是 id 屬性。
另外，因為一個文檔中的 name 屬性可能不唯一（如 HTML 表單中的單選按鈕通常具有相同的 name 屬性），所有 getElementsByName() 方法返回的是元素的數(shù)組，而不是一個元素。
實例
<html>
<head>
<script type="text/javascript">
function getElements() {
var x=document.getElementsByName("myInput");
alert(x.length);
}
</script>
</head>
<body>
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br /><br />
<input type="button" onclick="getElements()"value="How many elements named 'myInput'?" />
</body>
</html>
getElementById,它也是只有document對象才能使用,而且返回的是數(shù)組的第一個元素,呵呵,它的方法名都寫明了是getElement而不是getElements,所以,千萬不要搞渾了.getElementsByName返回的是所有name為指定值的所有元素的集合
“根據(jù) NAME 標(biāo)簽屬性的值獲取對象的集合?！奔媳葦?shù)組要松散的多, 集合里每個子項的類型可以不同, 集合只是把某些元素放在一起作為一類來使用, 相比之下數(shù)組就嚴(yán)格多了, 每個子項都是統(tǒng)一的類型. document.getElementsByName, document.getElementsByTagName, document.formName.elements 這類方法所得到的結(jié)果都是集合.用于批量更新時的數(shù)據(jù)傳遞.
getElementsByName() 方法可返回帶有指定名稱的對象的集合。
語法document.getElementsByName(name)
該方法與 getElementById() 方法相似，但是它查詢元素的 name 屬性，而不是 id 屬性。
另外，因為一個文檔中的 name 屬性可能不唯一（如 HTML 表單中的單選按鈕通常具有相同的 name 屬性），所有 getElementsByName() 方法返回的是元素的數(shù)組，而不是一個元素。
實例
復(fù)制代碼 代碼如下:
<html>
<head>
<script type="text/javascript">
function getElements() {
var x=document.getElementsByName("myInput");
alert(x.length);
}
</script>
</head>
<body>
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br /><br />
<input type="button" onclick="getElements()"value="How many elements named 'myInput'?" />
</body>
</html>
getElementById,它也是只有document對象才能使用,而且返回的是數(shù)組的第一個元素,呵呵,它的方法名都寫明了是getElement而不是getElements,所以,千萬不要搞渾了.getElementsByName返回的是所有name為指定值的所有元素的集合
“根據(jù) NAME 標(biāo)簽屬性的值獲取對象的集合?！奔媳葦?shù)組要松散的多, 集合里每個子項的類型可以不同, 集合只是把某些元素放在一起作為一類來使用, 相比之下數(shù)組就嚴(yán)格多了, 每個子項都是統(tǒng)一的類型. document.getElementsByName, document.getElementsByTagName, document.formName.elements 這類方法所得到的結(jié)果都是集合.用于批量更新時的數(shù)據(jù)傳遞.
相關(guān)文章
audio是音頻組件,用于播放一個基于http協(xié)議的音頻資源,這篇文章主要給大家介紹了關(guān)于微信小程序audio組件在ios端無法播放的解決辦法,需要的朋友可以參考下2021-07-07
微信小程序如何設(shè)置基本的頁面樣式，做出用戶界面UI
這篇文章主要介紹了微信小程序如何設(shè)置基本的頁面樣式，做出用戶界面UI。如何為這個頁面添加樣式，使它看上去更美觀，教大家寫出實際可以使用的頁面。2022-12-12
js 阻止子元素響應(yīng)父元素的onmouseout事件具體實現(xiàn)
本文為大家介紹下js阻止子元素響應(yīng)父元素的onmouseout事件，具體實現(xiàn)如下，感興趣的朋友可以參考下2013-12-12
在JavaScript中模擬類(class)及類的繼承關(guān)系
眾所周知,JavaScript中沒有類,然而我們卻可以動手實現(xiàn)一個擁有繼承特性的類,所以接下來我們要討論的便是在JavaScript中模擬類(class)及類的繼承關(guān)系:2016-05-05
本文主要講解了利用js制作xml在線編輯器的實例，文中講解實例的圖片和代碼非常詳細，感興趣的小伙伴現(xiàn)在一起來看一看吧2021-08-08
這篇文章主要為大家詳細介紹了Bootstrap列表組的學(xué)習(xí)使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
使用js使用新窗口打開頁面的時候，經(jīng)常遇到被瀏覽器攔截的情況，怎么解決呢？下面小編通過兩種情況分析并分別附有解決辦法，對js彈出新窗口被攔截感興趣的朋友一起學(xué)習(xí)吧2016-08-08
這篇文章主要為大家詳細介紹了微信小程序?qū)崿F(xiàn)評價功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-08-08
Nuxt3?布局layouts和NuxtLayout的使用詳解
layouts是Nuxt3提供的一種方便開發(fā)者快速實現(xiàn)自定義布局的約定，是基于Vue3的一個開發(fā)框架，基于服務(wù)器端渲染SSR，可以更加方便的用于Vue的SEO優(yōu)化，這篇文章主要介紹了Nuxt3?布局layouts和NuxtLayout的使用,需要的朋友可以參考下2023-04-04
下面小編就為大家?guī)硪黄粋€簡單不報錯的summernote圖片上傳案例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-07-07