爲什麼getElementsByTagName（）總是返回一個數組？

爲什麼如果我在文檔中只有一個h1元素，我仍然需要使用索引來訪問它？爲什麼getElementsByTagName（）總是返回一個數組？

像下面這樣不起作用。

document.getElementsByTagName('h1').innerHTML = "SHUSHAN";

，但如果我這樣做

document.getElementsByTagName('h1')[0].innerHTML = "SHUSHAN";

它的工作。

即使我只有一個h1，爲什麼我必須指定？

來源

2017-02-07 Hye Shusho

因爲返回類型是一個數組。想想如果這個函數有時返回一個en元素並且有時返回一個元素數組，那會是多麼的痛苦，那會是瘋狂的 – Keatinge

簡答：這是爲了讓你有一些理智。這樣

let foo = document.getElementsByTagName('h1') 
if (foo instanceof HTMLCollection) 
    // do something with all elements 
else 
    // do something with just one element

如果你不知道你是否會得到一個單一的元素或元素的集合，你會寫的防守，類型檢查（笨）代碼它使更多的方式意義的功能總是返回已知類型，HTMLElement的HTMLCollection的對象

如果你只關心獲得的第一個元素，你可以用解構賦值

let [first] = document.getElementsByTagName('h1') 
console.log(first) // outputs just the first h1

這是很好的，因爲分配清楚地表明，該公司預計元素的數組（或陣列等），但只關心第一個值

你也應該知道分配標識符更新的document.querySelector和document.querySelectorAll函數＆hellip;

document.querySelector將從文檔中選擇至多一個元件或返回null
document.querySelectorAll將總是返回一個HTMLCollection，但也可以是空的，如果沒有元件選擇器相匹配。

這是我怎麼會寫你的代碼在2017年

setTimeout($ => { 
 
    // get the element to change 
 
    let elem = document.querySelector('h1') 
 
    // update the text of the element 
 
    elem.textContent = 'SHUSHAN' 
 
}, 3000)

<h1>wait 3 seconds ...</h1>

來源

2017-02-07 00:16:02 naomik

你能告訴我setTimeout的$ => {...}是什麼意思嗎？ –

這只是一個匿名函數。它可以被重寫爲'function（）{...}' – naomik

getElement s ByTagName - 方法名稱本身意味着它將返回多個元素 - 即一個數組。該方法總是返回一個數組，其長度等於匹配元素的數量。因此，您必須始終通過數組中元素的索引訪問元素。

來源

2017-02-07 00:15:56 Sunny

數組必須由指數無論它有多少價值持有訪問。閱讀數組數據類型以更好地理解概念。

來源

2017-02-07 00:17:27

重點是getElementsByTagName總是返回一個HTMLCollection的元素，它主要作爲一個數組工作。如果此集合中只有一個元素，則其索引爲0。

這就是您必須指定索引的原因，即使文檔中只有一個元素。

點擊here或here查看更多相關文檔。

來源

2017-02-07 00:20:14

爲什麼getElementsByTagName（）總是返回一個數組？

回答

相關問題