DOM

Document.getElementsByName() メソッド

 編集:2022.09.03 by T.A.

Document 内で指定 name を持つ要素のノード リストを NodeList コレクションで返します。

構文
Document.getElementsByName(name)
Document 文字列。要素の name 属性の値です。
name
戻り値

生きた NodeList コレクション、つまり文書内で同じ name を持った新しい要素が追加されたり削除されたりすると自動的に更新されるものです。

メモ

IE および Edge では、NodeList ではなく HTMLCollection を返します。

name 属性は、(X)HTML 文書にのみ適用可能です。

返却された NodeList コレクションには、<meta> や <object> など、それに name 属性にまったく対応していない要素も含め、指定された name を持つすべての要素が含まれます。

getElementsByName メソッドは、IE10 以前では動作が異なります。この場合、getElementsByName() は指定された id 属性を持つ要素も返します。name および id で同じ文字列を使用しないように注意してください。

getElementsByName メソッドは IE では動作が異なります。この場合、getElementsByName() は name 属性を許容しない要素(<span> など)を返しません。

<!DOCTYPE html>
<html lang="en">
<title>document.getElementsByName の使用例</title>

<input type="hidden" name="up">
<input type="hidden" name="down">

<script>
  var up_names = document.getElementsByName("up");
  console.log(up_names[0].tagName); // "INPUT" と表示
</script>
</html>

HTML:

<SPAN name=Test>SPAN要素1</SPAN><BR>
<SPAN name=Test>SPAN要素2</SPAN><BR>
<INPUT name=Test><BR>
<FORM name=Test>
  <INPUT name=Test><BR>
</FORM>

JavaScript:

D=document.getElementsByName("Test")	//=[object]:[object NodeList]
	//0=[object]:[object HTMLSpanElement]
	//1=[object]:[object HTMLSpanElement]
	//2=[object]:[object HTMLInputElement]
	//3=[object]:[object HTMLFormElement]
	//4=[object]:[object HTMLInputElement]
	//entries=[function]:function entries() { [native code] }
	//keys=[function]:function keys() { [native code] }
	//values=[function]:function values() { [native code] }
	//forEach=[function]:function forEach() { [native code] }
	//length=[number]:5
	//item=[function]:function item() { [native code] }

テスト