サンプル５-兄弟ノードへのアクセスの例

result1(nextSibling):
result2(previousSibling):
htmlソース

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>サンプル５-兄弟ノードへのアクセスの例</title>
<script type="text/javascript">
window.onload = function(){
    var foo = document.getElementById("foo");
	var msg='';
	do{
		if(foo.nodeType==1){
			msg+=foo.innerHTML;
		}
		foo=foo.nextSibling;
	}while(foo)
	document.getElementById("result1").innerHTML=msg;
	
    var foo = document.getElementById("foo");
	var msg='';
	do{
		if(foo.nodeType==1){
			msg+=foo.innerHTML;
		}
		foo=foo.previousSibling;
	}while(foo)
	document.getElementById("result2").innerHTML=msg;
};
</script>
</head>
<body>
<h1>サンプル５-兄弟ノードへのアクセスの例</h1>
<hr />
<ul>
    <li>あ</li>
    <li>い</li>
    <li id="foo">う</li>
    <li>え</li>
    <li>お</li>
</ul>
<div id="msg"></div>
<div>
	result1(nextSibling):<span id="result1"></span><br />
	result2(previousSibling):<span id="result2"></span><br />
</div>
</body>
</html>