removeChild Firefox兼容问题。

<html>
<head>
<title>删除元素</title>
<script type="text/javascript">
function delNode(){
var para = document.getElementById("delUl");
var paraLen = para.getElementsByTagName("li").length;
if(paraLen>0)
{
para.removeChild(para.lastChild);
}else{
alert("没有了!");
}
}
</script>
</head>
<body>
<ul id="delUl">
<li>list1</li>
<li>list2</li>
<li>list3</li>
<li>list4</li>
<li>list5</li>
</ul>
<input type="button" value="Delete" onclick="delNode();" />
</body>
</html>这段代码在IE中删除最后一个节点没有问题，但在firefox中每次点了删除后不会删除，再点一次才能删除。请问这是什么原因？谢谢！

解决方案 »

  1.   

    Firefox中还多几个文本节点(nodeType: 3)<html>
    <head>
    <title>删除元素</title>
    <script type="text/javascript">
    function delNode(){
    var para = document.getElementById("delUl");
    var paraLen = para.getElementsByTagName("li").length;
    if(paraLen>0)
    {
    //alert(para.lastChild.nodeType); // 3
    while (para.lastChild && para.lastChild.nodeType == 3) 
    para.removeChild(para.lastChild);
    para.removeChild(para.lastChild);
    }else{
    alert("没有了!");
    }
    }
    </script>
    </head>
    <body>
    <ul id="delUl">
    <li>list1</li>
    <li>list2</li>
    <li>list3</li>
    <li>list4</li>
    <li>list5</li>
    </ul>
    <input type="button" value="Delete" onclick="delNode();" />
    </body>
    </html>
      

  2.   


    function delNode(){
    var para = document.getElementById("delUl");
    var paraLen = para.getElementsByTagName("li").length;
    if(paraLen>0)
    {
    para.removeChild(para.lastElementChild ? para.lastElementChild : para.lastChild);
    }else{
    alert("没有了!");
    }
    }
      

  3.   

    1楼正解，Firefox中取出的 lastChild是一个文本节点 TextNode