<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>nextSibling</title> </head> <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; } 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>已经是最后一个节点"); } // 获取上一个节点代码开始 function get_previousSibling(n){ var x=n.previousSibling; while (x && x.nodeType != 1){ x=x.previousSibling; } return x; } var li5 = document.getElementsByTagName("li")[4]; document.write("<br/><br/>" + li5.nodeName); document.write(" = "); document.write(li5.innerHTML); var node = get_previousSibling(a); if(node != null){ document.write("<br/>previousSibling:"); document.write(node.nodeName); document.write(" = "); document.write(node.innerHTML); }else{ document.write("<br/>已经是第一个节点了"); } </script> </body> </html>
为什么明明上一个节点是css的,结果却是“已经是第一个节点了”?问题出在哪里?请大神指教
为什么第7行要返回 li5啊
晕,原来是自己传参传错了,正确的代码应该是这样的:
// 获取上一个节点代码开始 function get_previousSibling(n){ var li5=n.previousSibling; while (li5 && li5.nodeType != 1){ li5=li5.previousSibling; } return li5; } var li5 = document.getElementsByTagName("li")[4]; document.write("<br/><br/>" + li5.nodeName); document.write(" = "); document.write(li5.innerHTML); var node = get_previousSibling(li5); if(node != null){ document.write("<br/>previousSibling:"); document.write(node.nodeName); document.write(" = "); document.write(node.innerHTML); }else{ document.write("<br/>已经是第一个节点了"); }