javascript重設（base層）

標籤：

1、nextSibling瀏覽器安全色問題

<ul>        <li id="item1"></li>        <li id="item2"></li>        <li id="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彈出的內容依次是：item2,1,3

firefox，ie9+，chrome彈出的內容依次是：undefined，3,7 原因是：nodeType=3表示是文本節點，而不是1元素節點。firefox瀏覽器將包括空白、換行等文本資訊也當做childNodes中的一員，而ie8會忽略它，只將DOM節點當做是childNodes的一員。

解決方案一：縮排HTML（不推薦）

<ul><li id="item1"></li><li id="item2"></li><li id="item3"></li></ul>

解決方案二：

    function getNextNode(node) {        node = typeof node == "string" ? document.getElementById(node) : node;        var nextNode = node.nextSibling;        if (!nextNode) return null;//        if(!document.all){      //不能區分出ie9，ie10        if ($.support.leadingWhitespace) {            while (true) {                if (nextNode.nodeType == 1) {                    break;                }  //如果下一個節點是元素節點則返回                else {                    if (nextNode.nextSibling) {    //如果下下個節點存在                        nextNode = nextNode.nextSibling;                    } else {                        break;                    }                }            }        }        return nextNode;    }    var nextNode = getNextNode("item1");    alert(nextNode.id);    var nextNode2 = getNextNode("item2");    alert(nextNode2.id);

 

javascript重設（base層）