为什么getElementsByTagName（）[0]返回但是getElementById（）[0]返回未定义？

Question

我正在尝试以下代码并获得以下结果

console.log(document.getElementsByTagName('a')[0]); //retuns <a id="link" href="http://stackoverflow.com/questions/ask"></a>

console.log($('a')[0]);//retuns <a id="link" href="http://stackoverflow.com/questions/ask"></a>

console.log(document.getElementById('link'));//retuns <a id="link" href="http://stackoverflow.com/questions/ask"></a>

console.log(document.getElementById('link')[0]);// returns undefined 

console.log($('#link')[0]); //retuns <a id="link" href="http://stackoverflow.com/questions/ask"></a>

任何人都可以告诉为什么这个（console.log(document.getElementById('link')[0]);// returns undefined和console.log($('#link')[0]); //retuns <a id="link" href="http://stackoverflow.com/questions/ask"></a>）有线行为？

Demo

Answer 1

getElementsByTagName（复数）返回一个数组。

getElementById（单数）返回单个元素（或null）。