<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 ">
<title>nextSibling</title>
<body>
<ul id= "U1" >
<li id= "a" >javascript</li>
<li id= "B" >jquery</li>
<li id= "C" >html</li>
</ul>
<ul id= "U2" >
<li id= "D" >css3</li>
<li id= "E" >php</li>
<li id= "F" >java</li>
</ul>
<script type= "Text/javascript" >
function get_nextsibling (n) {
var x=n.nextsibling;
while (x && x.nodetype!=1) {
x=x.nextsibling;
}
return x;
}
function get_previoussibling (n) {
var a=n.previoussibling;
while (a && a.nodetype!=1) {
a=a.previoussibling;
}
return A;
}
var x=document.getelementsbytagname ("Li") [0];
document.write (X.nodename);
document.write ("=");
document.write (x.innerhtml);
var y=get_nextsibling (x);
if (y!=null) {
document.write ("<br/>nextsibling:");
document.write (Y.nodename);
document.write ("=");
document.write (y.innerhtml);
}else{
document.write ("<br> is already the last node");
}
var a=document.getelementsbytagname ("Li") [2];
document.write ("<br/>" +a.nodename);
document.write ("=");
document.write (a.innerhtml);
var b=get_previoussibling (a);
if (b!=null) {
document.write ("<br/>previoussibling:");
document.write (B.nodename);
document.write ("=");
document.write (b.innerhtml);
}
else{
document.write ("<br/> is already the first node");
}
</script>
</body>
The NextSibling property returns the node immediately following a node (in the same tree hierarchy) PreviousSibling property returns the node immediately before a node (in the same tree hierarchy).