zoukankan      html  css  js  c++  java
  • 利用循环removeChild删除节点只删除一半问题

    <!DOCTYPE html>
    <html>
      <head>
        <title>adduser.html</title>
          
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
          
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
        <script type="text/javascript" src="../js/append1.js"></script>
          
      </head>
        
      <body >
        <div align="center">
            <div>添加联系人</div>
            <input type="text" name="name">姓名<br/>
            <input type="text" name="phone">电话<br/>
            <input type="text" name="mail">邮箱<br/>
            <input type="button" onclick="add()" value="提交">
        </div>
        <hr>
        <div align="center">
            <table border="1" cellspacing="0" id="table">
                <tr id="Button">
                    <td colspan="4" align="center">
                        <input type="button" value="全选" onclick=All()>
                        <input type="button" value="反选" onclick=other()>
                        <input type="button" value="删除" onclick=Delete()>
                    </td>
                </tr>
                <tr>
                    <td><input name="items" type="checkbox" ></td>
                    <td>李四</td>
                    <td>1361888234</td>
                    <td>ab@sina.com</td>
                </tr>
            </table>
              
        </div>
      </body>
    </html>
    function add(){
                              
                    var Node_name=document.getElementsByName("name")[0];
                    var Node_phone=document.getElementsByName("phone")[0];
                    var Node_mail=document.getElementsByName("mail")[0];
                      
                    var Element_tr=document.createElement("tr");
                      
                    var select_td=document.createElement("td");
                    var input_node=document.createElement("input");
                    input_node.setAttribute("name","items");
                    input_node.setAttribute("type", "checkbox");
                    select_td.appendChild(input_node);
                  
                    var name_td=document.createElement("td");
                    var name_text=document.createTextNode(Node_name.value);
                    name_td.appendChild(name_text);
                      
                    var phone_td=document.createElement("td");
                    var phone_text=document.createTextNode(Node_phone.value);
                    phone_td.appendChild(phone_text);
                      
                    var mail_td=document.createElement("td");
                    var mail_text=document.createTextNode(Node_mail.value);
                    mail_td.appendChild(mail_text);
                      
                      
                    Element_tr.appendChild(select_td);
                    Element_tr.appendChild(name_td);
                    Element_tr.appendChild(phone_td);
                    Element_tr.appendChild(mail_td);
                      
                    var Element_table=document.getElementById("table");
                    Element_table.appendChild(Element_tr);
      
            }
              
              
            function All(){
                var check_node=document.getElementsByName("items");
                for ( var i = 0; i < check_node.length; i++) {
                    check_node[i].checked="checked";
                }
            }
            function other(){
                var check_node=document.getElementsByName("items");
                for ( var i = 0; i < check_node.length; i++) {
                    if(check_node[i].checked){
                        check_node[i].checked=null;
                    }else{
                        check_node[i].checked="checked";
                    }
                }
            }
              
            function Delete(){
                var check_node=document.getElementsByName("items");
                //alert(check_node.length);             for ( var i = 0; i < check_node.length; i++) {
                      
                    if(check_node[i].checked){
                        //alert(check_node[i].checked);                     var delete_tr_node=check_node[i].parentNode.parentNode;
                        //alert(delete_tr_node.nodeName);                     var Element_table=document.getElementById("table");
                        Element_table.removeChild(delete_tr_node);
                    }
                }
            }
     
     
     
    For循环颠倒一下就可以了,现在循环是从小到大,改成从大到小就可以了,因为数组长度在变化
  • 相关阅读:
    一个简单的禁止鼠标滚轮事件处理
    模仿抽奖转盘,并且用cookie记录历史次数
    学习jquery
    使用var提升变量声明
    Django 自带密码加密,自定密码加密方式 及自定义验证方式
    kindEditor使用并防止xss攻击(day88)
    python二维码生成库(qrcode)简介和实例
    js原型的区别
    js中 this与that
    python单元测试之unittest框架使用总结
  • 原文地址:https://www.cnblogs.com/firstdream/p/5264259.html
Copyright © 2011-2022 走看看