尝试使用javascript删除子html元素

时间:2014-09-13 14:24:21

标签: javascript html

我的boostrap标签中有3个表格。每个选项卡作为表。该表的行是使用csharp asp.net代码动态生成的。正确我想要一个场景,如果用户点击第一个表的行,第一个表的点击角色将从第一个表中删除,并被添加到第二个表的行中。

我的挑战是在onClick进程之后删除行。

 <tbody>
     <tr id="kayode@yahoo.com">
                     <td> kayode <a class="chat" connectionid="135976e6-799b-4cda-a764-a00f7110d515"
 data-parentid="kayode@yahoo.com"
 href="/Visitor/StartChat?threadid=3&amp;email=kayode%40yahoo.com"
 operatorid="1" target="_blank" threadid="3">chat</a></td>
                     <td>271.0.0.1</td>
                     <td>Active</td>
                     <td></td>
                     <td>9/13/2014</td>
                     <td>04:15:18</td>
                     <td>02:52:55</td>
                     <td>271.0.0.1</td>
                 </tr>

</tbody>

我试图在Click事件后删除行的javascript代码。

function updateWaitingState(sender) {

        var parentid = $(sender).attr("data-parentid");
        //alert(parentid);

        //we are going to remove the role from this field
        var element = document.getElementById(parentid);

         element.parentNode.removeChild(element);   //This line is a problem says 

        //document.querySelector("tablebody4 first").appendChild(element);

        console.log(element);
 }

2 个答案:

答案 0 :(得分:0)

这是未经测试的,但我认为jQuery会大大减轻您的头痛:

function updateWaitingState(sender) {
    var parentId = $(sender).attr("data-parentid");
    $('#' + parentId).appendTo('.tablebody4:first');
}

您可能需要调整appendTo功能中的选择器,因为这是我的猜测。

答案 1 :(得分:0)

 function updateWaitingState(sender) {

        var parentid = $(sender).attr("data-parentid");

        var element = document.getElementById(parentid);
        $(element).appendTo('.tablebody2:first');
 }