getElementById() は、HTMLで指定したid名の要素を参照します。
<div id="test"></div>let test = document.getElementById("test")また、HTML内で指定したid名の要素は JavaScriptではid名をグローバル変数として利用できます。
厳密には、HTML内で指定したid名はwindowオブジェクトのプロパティとしてJavaScriptで参照できるようになります。また、windowは省略できるので「window.test」は「test」としてアクセス可能です。
・document.getElementById(“test”)
・window.test
・window[“test”]
・test
これらはずべて同じ要素（Element）のオブジェクトです。
使用例：
test.style.color = newColorここまでで「let test = document.getElementById(“test”)」は必要ないんじゃないかと思われますが、実はgetElementById() を省略するのは非推奨とされています。
getElementById() を省略するのは非推奨とされている理由
「id名」に数値・予約語・演算子が利用できない
例えば、HTML内で指定したid名が「id=”123″」のように数字のみの場合や「id=”var”」のように予約語（ifやforなど役割が決まっている単語）の場合はgetElementById() を省略することができません。
document.getElementById("123")
document.getElementById("var")このようにgetElementById()を使用すれば利用することは可能です。
また、「id=”menu-box”」のようにid名に演算式（+, -, +, / など）が含まれている場合もgetElementById() を省略することができません。
document.getElementById("menu-box")こちらも、このようにgetElementById()を使用すれば利用することは可能です。
あらたに同名の変数を宣言するとアクセスできなくなる
HTML内で指定したid名を別の用途で使用する変数名に利用した場合に予期しないエラーが起こる可能性があります。
let test = "違う変数"
test.textContent = "test"サポートしていないブラウザがある可能性がある
IE8以前のブラウザなど、getElementById() を省略することができないブラウザもあるようです。
新しい機能が追加された場合など使えなくなる可能性がある
HTML内で指定したid名はwindowオブジェクトのプロパティとしてJavaScriptで参照できるようになりますが、「name」や「scrollX 」のようなwindowオブジェクトとしてのプロパティとして決まっている単語を利用することはできません。
また、今使っているid名と同じ名前のプロパティが新しい機能として追加された場合には、getElementById() を省略していると予期しないエラーが起こる可能性があります。
document.getElementById("name")
document.getElementById("scrollX")このようにgetElementById()を使用すれば利用することは可能です。
