JavaScript reset (Base layer)

1, nextsibling Browser compatibility issues

<ul>        <LiID= "Item1"></Li>        <LiID= "Item2"></Li>        <LiID= "Item3"></Li></ul>

var item1=document.getelementbyid ("item1"); alert (item1.nextSibling.id); alert ( Item1.nextSibling.nodeType); alert (document.getElementsByTagName ("ul") [0].childnodes.length);

Ie8,ie7 Pop-up content is: item2,1,3

Firefox,ie9+,chrome pops up in order: The undefined,3,7 reason is that the nodetype=3 is a text node, not a 1 element node. The Firefox browser will include text messages such as whitespace, line breaks, and so on as a member of ChildNodes, while IE8 ignores it and only considers the DOM node as a member of ChildNodes.

Solution One: Indent HTML (not recommended)

 <  ul  ><  li  id  = "Item1"  ></ li  ><  li  id  = "item2"  ></ li  ><  li  id  = "Item3"  ></ li  ></ ul  >  

Solution Two:

    functionGetnextnode (node) {node=typeofnode = = "String"?document.getElementById (node): node; varNextNode =node.nextsibling; if(!nextnode)return NULL;//if (!document.all) {//cannot differentiate out ie9,ie10        if($.support.leadingwhitespace) { while(true) {                if(Nextnode.nodetype = = 1) {                     Break; }  //returns if the next node is an element node                Else {                    if(nextnode.nextsibling) {//if the next node existsNextNode =nextnode.nextsibling; } Else {                         Break; }                }            }        }        returnNextNode; }    varNextNode = Getnextnode ("Item1");    alert (nextnode.id); varNextNode2 = Getnextnode ("item2"); alert (nextnode2.id);

JavaScript reset (Base layer)