Javascript 使用.append-Jquery重新加载数据会生成数据堆栈并复制数据

我有一个表，它是用ajax动态提供的，并使用Jquery将数据附加到我的表中。到目前为止，这是工作正常，但当我试图重新加载数据，它只是堆叠的数据

下面是我到目前为止使用的函数，它在最初加载页面时工作得非常好

loadIncidents: function () {
    $.ajax({
        url: this.basePath() + '/GDI_PROD_Incidents?$filter=ÉtatValue%20ne%20%27Fermé%27&$orderby=PrioritéValue desc',
        dataType: 'json',
        cache: false,
        success: function (data) {

            $.each(data.d.results, function (index, incident) {

            $('#example').append(
            "<tr>" +
            "<td> <button class='edit_button btn btn-info btn-circle btn-xs' name ='btnSubmit' type='button' value='Edit' data-ID='"+incident.ID+"'><i class='glyphicon glyphicon-edit' data-original-title='' title=''></i></button></td>" +
            "<td>" + incident.Incident + "</td>" +
            "<td>" + incident.PrioritéValue + "</td>" +
            "<td>" + incident.Composante + "</td>" +
            "<td>" + incident.Description + "</td>" +
            "<td>" + incident.DateDeDébut + "</td>" +
            "<td>" + incident.DateDeFin + "</td>" +
            "</tr>");                   

            })
        }
    });
},

以下是我的HTML代码：

            <table class="table table-bordered table-hover" id="example">
                <thead>
                    <tr>
                        <th>Action</th>
                        <th>Incident</th>
                        <th>Priorité</th>
                        <th>Composante</th>
                        <th>Description</th>
                        <th>Date de début</th>
                        <th>Date de fin</th>
                    </tr>
                </thead>
            </table>

行动
发生的事情
优先权
沉着
描述
戴布特日期
财务日期

---

我查看了Jquery文档并尝试了.html，但这似乎打破了这个表。寻找一些关于这方面的最佳方法的建议。非常感谢您的反馈。

一个选项是清空父HTML元素，在这种情况下很可能是

在代码中，成功函数可以首先执行以下操作：

success: function (data) {
    $('tbody').empty();
    ...

这将首先清除可能已经存在的任何数据，然后将立即继续使用其他代码并将新数据附加到位

---

我按照你的建议做了，做得很好。谢谢你，查尔斯。

success: function (data) {
    $('tbody').empty();
    ...