如何删除html表中的行？

Question

I want to refresh the table but every time the setinterval active the append insert the same rows again, i want that those rows get removed for the new ones

    $(document).ready(function() 
{ 

    function actualizar()
    {
    $.ajax({
        type: "GET",
        url: "editinplace.php?tabla=1"
    })
    //Vector
    .done(function(json)  
    {
        json = $.parseJSON(json)
        for(var i=0;i<json.length;i++)
        {
            $('.editinplace').append
            (
                "<tr><td class='id'>"
                +json[i].id
                +"</td><td>"
                +json[i].nombre
                +"</td><td>"
                +json[i].apellidos
                +"</td><td>"
                +json[i].telefono
                +"</span></td><td class='editable' data-campo='status'><span>"
                +json[i].status
                +"</span></td></tr>");
        }
        //
    });


    } 
    setInterval(actualizar, 6000);

Answer 1

.append will, as the name suggests, append content.

Either do something like $('.editinplace tr').remove(); to remove all the existing rows before appending, or replace .editinplace entirely:

$('.editinplace').replaceWith("<table class='editinplace'>"
+  "<tr><td class='id'>"
...
+ "</table>");

See http://api.jquery.com/remove/ and http://api.jquery.com/replacewith/ for more info.

Ref comments, for testing the existence, I'd add a data attribute to the rows so that you could search for them easily. E.g. replace "<tr><td class='id'>" with "<tr data-id='" + json[i].id + "'><td class='id'>".

Then in your for() loop, simply check if it exists yet:

if ($('.editinplace tr[data-id="' + json[i].id + '"]').length == 0) {
    // append
}