子要素を取得する　childNodes.item( ).属性

[説明]

[サンプル]

※id="groups"の子要素を取得

[実行結果]

[ソースコード]

<div id="groups">
	<div id="kikaku">企画部</div>
	<div id="gijyutsu">技術部</div>
	<div id="eigyou">
		<div id="eigyou_1">第一営業部</div>
		<div id="eigyou_2">第二営業部</div>
	</div>
</div>
<input type="button" id="btn" value="子要素取得" />

<script type="text/JavaScript">
var sample = document.getElementById('koko');
var btn = document.getElementById('btn');

btn.onclick = function(){
	var divElements = document.getElementById('groups'); // id="groups"を取得

	var nodeList = divElements.childNodes; // id="groups"の直下にあるchildNodesを取得

	var str = "";

	for(var i = 0 ; i < nodeList.length ; i++){ // childNodeの数はlengthで数える
		str += "「" + nodeList.item(i).id + "」" + "\n"; // childNodesの個々の要素はitem( i )で取得する。属性はid、value、nameなど。
	}
	sample.innerHTML = str;
}

※childNodesは直下のみの子要素を取得する（groupsの直下はkikaku、gijyutsu、eigyouの3つ）

childNodesは文章中、複数箇所に登場するものであるから、文章中上から数えて何番目のものにアクセスするのかを指定してやる必要がある。item( i )で個々の要素を指定する。
getElementsByTagName(); と比較

インデックスにもどる