質問: こんにちは。 Javascriptを勉強し始めたばかりです。 テキストに「オブジェクトの中のデータをWEBに表示させる」というワークがあるのですが、 ふとした時に、document.getElementById("xxxxx")はなぜ必要なのかと思い投稿させていただきました。 実際に、下記2種類を書いてWebに反映させたところ、全く同じレイアウトで同じテキストが反映されました。 実際にはどのように違うものなのか教えてください。 よろしくお願いいたします。
回答: `getElementById`メソッドはHTML文書から得られたDOMツリーの中の`id`値をもつノードを抽出するためのものです. 通常これさえあればDOM内の検索は可能なのですが, いちいち`document.getElementById`と入力するのは面倒なので, HTML文書読み込み時に`id`属性を持つノードが現れると勝手にグローバル変数(`window`オブジェクトの疑似プロパティ)にノードを追加することになっています. つまりノード``は変数`window.title`(`window`は省略可能なので`title`)としてアクセス可能です. とは言え, このグローバル変数への登録処理は**HTML文書読み込み時の1度だけ行われる**ので, スクリプトを使って新たな`id`属性を持つノードをDOMに追加し, それを抽出する場合は`getElementById`メソッドを使わなければならない...のです. なお, この`id`による直接アクセスはブラウザ毎に**細かい部分で実装が異なる**ため, 広く互換性を求める用途には適していません. 参考