- ベストアンサー
getElementByIdを使用したグローバル変数の定義（使い方について）
グローバル変数の定義について教えてください。 getElementByIdを、グローバル変数で使用することはできないのでしょうか？ 【グローバル変数（整数）】の場合 ------------------------------------------------- //グローバルで整数を定義 var a = 10; function test(){ alert(a.value); } 結果：「10」が表示される。 ------------------------------------------------- 【グローバル変数（getElementByIdを使用)の場合】 ------------------------------------------------- //グローバルでgetElementByIdで取得したオブジェクトを定義 var a = document.getElementById("objname"); function test(){ alert(a.value); } 結果：「null」 が表示される。 ※a = document.getElementById("objname"); でも同様。 ------------------------------------------------- 【ローカル変数（getElementByIdを使用)の場合】 ------------------------------------------------- function test(){ //ローカルでgetElementByIdで取得したオブジェクトを定義 var a = document.getElementById("objname"); alert(a.value); } 結果：「画面入力値」 が表示される。 ------------------------------------------------- このように getElementByIdで取得したオブジェクトを、 グローバル変数として扱った場合、nullとなるので困っています。 getElementByIdで取得したオブジェクトを、 グローバル変数として扱う良い方法はないでしょうか？ 【環境】 OS:WindowsXP Pro 使用JavaScript：外部ファイルのjavaScript
- Guno-this
- お礼率89% (222/248)
- JavaScript
- 回答数3
- ありがとう数7
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
受取変数がグローバルかどうかが問題では無くて、getElementById の実行が早すぎるのが原因でうまくいかないのは無いでしょうか。 つまり、その ID のタグがまだ誕生していないタイミングで getElementById を発行しても null で当然という訳です。 例えば、以下にすればどうでしょう？ 【グローバル変数（getElementByIdを使用)の場合】 ------------------------------------------------- // グローバル変数の定義 var a; function onLoad() { // BODYタグの onload で実行される関数 //グローバル変数に getElementById で取得したオブジェクトを代入 a = document.getElementById("objname"); } function test(){ alert(a.value); }
その他の回答 (2)
- yambejp
- ベストアンサー率51% (3827/7415)
ほぼ#２と同じですが、window.onloadを使うのがスマート <script> var a=Object(); window.onload=function(){ a = document.getElementById("objname"); test(); } function test(){ alert(a.value); } </script> <input type="text" value="xxx" id="objname">
お礼
ご回答ありがとうございます。 ご指南いただきました、 window.onloadを実装させていただきました。 こういう方法があるの知らなかったもので、 とても参考になりました。 どうもありがとうございました。
- babu_baboo
- ベストアンサー率51% (268/525)
スクリプトを、うしろにおく！(</body>のちょくぜん） var a = document.getElementById("objname"); が<head>～</head>ないにあると、それがじっこうされたとき まだそのようそが、そんざいしてないから
お礼
どうも、ありがとうございます。 ちょっと試してみたのですが、上手くいきませんでした。汗 （指定の仕方が悪かったのかもしれませんが(--；） たしかに無いものに対して「取得しにいこうとしていた」のですから、 無い(null)のは当然だったということですね(--; 参考なります。 ありがとうございます。
お礼
ご回答ありがとうございます。 ご指南いただいた方法で試してみたところ、 正常に取得できました。とても助かります。 【前回の状態】 １．Bodyの内容が読み込まれていない（つまり、オブジェクトが誕生していない）状態がある。 ２．getElementById で「Body内容のオブジェクトの取得指示を出す」 ３．Bodyが生成されていない状態で取得指示を出しているため、nullを返した。 【対応後の状態】 １．ページがロードされた後（onLoad)後に「変数宣言する」に設定。 ２．getElementById で「Body内容のオブジェクトの取得指示を出す」 ３．ページがロードされた（＝オブジェクトが存在している状態）でgetElementById をしようしたため、正常に取得が完了。