<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script language="JavaScript">
function test() {
var node = document.getElementById("li2");
alert(node.id+"---"+node.innerText);//li2---J2EE
alert(node.nextSibling.id+"---"+node.nextSibling.innerText); //Li3---Haha
alert(node.previousSibling.id+"---"+node.previousSibling.innerText); //li1---Magci
alert(node.nextSibling.previousSibling.id+"---"+node.nextSibling.previousSibling.innerText); //li2---J2EE
alert(node.parentElement.id); --u1
}
function test2() {
var node = document.getElementsByTagName("li");
for(var i=0;i<node.length;i++) {
if(node[i].nextSibling) {
alert(node[i].nextSibling.id);
}
}
}
function test3() {
var node = document.getElementsByTagName("input");
for(var i=0;i<node.length;i++) {
if(node[i].type=="checkbox"){
alert(node[i].id);
alert(node[i+1].id);
}
}
}
</script>
</head>
<body>
<ul id="u1">
<li id="li1" class="li1">Magci</li>
<li id="li2">J2EE</li>
<li id="li3">Haha!</li>
</ul>
<ul id="u2">
<li id="li4" class="li1">Magci2</li>
<li id="li5">J2EE2</li>
<li id="li6">Haha2!</li>
</ul>
<ul id="u3">
<input type="checkbox" id="aa" value="Click Me!" > aa </input>
<input type="checkbox" id="bb" value="J2EE2" > bb </input>
<input type="checkbox" id="cc" value="Haha2!" > cc </input>
</ul>
<input type="button" value="Click Me!" onClick="test();" />
<input type="button" value="Click Me!" onClick="test2();" />
<input type="button" value="Click Me!" onClick="test3();" />
</body>
</html>
?