javascript - 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(singular) 単一の要素 (または null) を返します。