ここから本文です

JavaScriptで、ele=document.getElementById("test") ele.innerHTML=.... のように...

abroad128さん

2013/12/1412:53:39

JavaScriptで、ele=document.getElementById("test")
ele.innerHTML=....
のようにしなくても、
text.innerHTML=....
のよ

うにIDを直接使ってもできるんですが、これではダメなんですか?

補足<div id=text></div>
<script>
onload=function(){
document.getElementById("text").innerHTML="123"
}
</script>

_____________

<div id=text></div>
<script>
onload=function(
text.innerHTML="123"
}
</script>

このふたつのどちらも、123が表示されるんですです。
ならば、下の方がいいのに、ネット上では、ちゃんと上ほうのやり方でやっていますが、なんでですか?

閲覧数:
841
回答数:
3

違反報告

ベストアンサーに選ばれた回答

rishorusさん

2013/12/1420:40:58

ID で直接参照できるのは、昔の IE の仕様の名残です。その昔(今でもですけど)、Microsoft は ASP と IE とで同じように書ける仕組みにしました。それが ID を直に参照できる仕様です。

当然ながら、それは IE でしか動作しないものでした(Opera が追従したんだったかな)。当時、IE のシェアが 90% を超えていましたから、その書き方のコードが大量生産されました。

で、現在、そういう昔のコードもある程度サポートせざるをえなくなったので、HTML(5) が ID を直接参照できるように仕様に加えてくれたんです。

ただもちろん、グローバル変数をまき散らすことになります。仕様が決まってしまったものは仕方ないですけれど、あまり好ましいものではないですね。ID に "hoge-foo" のようにハイフンを入れておけば、少なくとも hoge-foo のように変数参照されることはなくなります(まあ、window["hoge-foo"] には無力)。

この質問は投票によってベストアンサーに選ばれました!

ベストアンサー以外の回答

1〜2件/2件中

並び替え:回答日時の
新しい順
|古い順

k_ra_7さん

編集あり2013/12/1416:16:36

一般的には良くないと思います。

[1] FireFox では動かない
一番大きな理由です。
…と思ったら動きました。すみません。
しかし、一昔前の FireFox では動かなかったと記憶しています。

[2] 他の window のプロパティと被ると、参照できないことがある
<div id="history"></div> としたときに、
history.innerHTML = "hogehoge"; とはできません。
historyオブジェクトへの参照を優先してしまうためです。
(他にも、alert, top などがあります)
もちろん、document.getElementById("history").innerHTML = "hogehoge"; はオッケーです。

追加で [3] ハイフンありの ID では使えない
<div id="abc-def"></div> としたときに、
abc-def.innerHTML = "hogehoge"; とはできません。
もちろん、document.getElementById("abc-def").innerHTML = "hogehoge"; はオッケーです。



ただ、自分の環境ですばやく JS のテストしたい場合などは、document.getElementById などと入力するのは面倒なので、私も省略してしまうことがあります。

編集あり2013/12/1415:37:27

ダメです。あなたのブラウザでできたとしても、他のブラウザではできない可能性大です。

それに、Chromeでも動きません。

[補足]
下の方はおかしいです。
function( ←)がない
{がない→ }
明らかに文法違反です。

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問や知恵ノートは選択されたID/ニックネームのMy知恵袋で確認できます。