idからエレメント取得するには？

質問

(1)<INPUT NAME="name1" MAXLENGTH="10" VALUE="" id="id1" >
(2)<INPUT NAME="name2" onKeyPress="chk(event);" VALUE="" id="id2">

上記の二つのinputタグのＩＤからエレメントを取得したいと思っています
知っている限りではgetElementByIdを使おうと思い
例） a = document.getElementById('id1');
b = document.getElementById('id2');
実行してみた所(1)は上手く行きましたが
(2)では上手く行きませんでした。

アラートを表示させ結果を見てみた所
(1)[object]
(2)null
になりました

どうして(2)のほうはエレメントが取れずnullになるのでしょうか？
また(2)のinputタグからエレメントを取る方法はありますでしょうか？

よろしくお願いいたします

回答No.3

PED02744 · ベストアンサー

name属性とid属性は　同一箇所にマッピングされます。
（正確に言うとname属性は古くて、id属性を使うことが推奨。XHTML1.1からname属性は廃止）
なので、NAME属性を指定しないほうがよいです。
もしどうしても、両方指定したいのならば、NAME属性とID属性は同じ値を入れないといけません。
http://www.kanzaki.com/docs/html/htminfo12.html

IE7だと、どっちもエレメントが取れる（他の方の回答と同じ）ので、
別の問題だと思います。（大文字小文字の区別だとか）

回答No.4

神崎 渉瑠（@taloo）

<input>についてはnameとidが異なっていてもいいです。
でなければ、<label>が使用出来なくなります。

<label for="id1"><input type="checkbox" name="chk" id="id1" value="1">ラベル</label>
<label for="id2"><input type="checkbox" name="chk" id="id2" value="2">ラベル</label>

<a>ではnameとidは同じでなければなりません。

<div>などにはhtml、xhtmlともにnameは使えません。。。だったと思います。HTML4.01transitionalは非推奨だったかも。。。あとで確認せねば（汗）

ただ、このような場合に取得出来なくなるのであれば、ブラウザのバグとしか考えられないですね。
（ただでさえバグの多いプレビューリリースやアルファ版、ベータ版なら普通に考えられますが、ANo.2では(1)(2)の両方とも取得出来てませんから、同じ現象ではないですよね。）

ANo.1でコードしか言及してませんが、OS、ブラウザとバージョンは何でしょうか？
たぶん、この部分以外の所に問題があって、スクリプトがそこで止まってるんだと思います。（もう解決してると思いますが(^^;）

回答No.2

himajin100000

========testcase=============

<INPUT NAME="name1" MAXLENGTH="10" VALUE="" id="id1" >
<INPUT NAME="name2" onKeyPress="chk(event);" VALUE="" id="id2">
<script type="text/javascript">
a = document.getElementById('id1');
b = document.getElementById('id2');
alert(a);
alert(b);
</script>

==========result==============
IE 7 [object][object]
Opera 9.20 8713 [object HTMLInputElement][object HTMLInputElement]
Fx 3.0a3pre [null][null]

参考までに。

回答No.1

神崎 渉瑠（@taloo）

<INPUT NAME="name1" MAXLENGTH="10" VALUE="" id="id1" >
<INPUT NAME="name2" onKeyPress="chk(event);" VALUE="" id="id2">
および
a = document.getElementById('id1');
b = document.getElementById('id2');
と、確認のために追加した
alert(a);
alert(b);
を試してみましたが、[object]が２回出力（alert）されました。

再現出来ないことには原因はわかりませんので、
現象を再現出来る最低限のコードを書いてもらえないでしょうか。