// 错误示例：点击按钮多次会导致多次绑定事件
$('#btn').click(function() {
    $('#container').append('<table>...</table>');
});

// 正确做法：使用one()或先解绑再绑定
$('#btn').one('click', function() {
    $('#container').append('<table>...</table>');
});

// 或者
$('#btn').off('click').on('click', function() {
    $('#container').append('<table>...</table>');
});

// 错误示例：可能在循环或条件判断中多次调用
function addTable() {
    $('#container').append('<table>...</table>');
}

// 可能被多次调用导致追加多次

// 正确做法：先清空或检查是否已存在
function addTable() {
    $('#container').empty().append('<table>...</table>');
}

// 错误示例：AJAX成功回调中可能重复追加
$.ajax({
    url: 'data.json',
    success: function(data) {
        $('#container').append(generateTable(data));
    }
});

// 如果多次调用此AJAX请求会导致多次追加

// 正确做法：先清空或使用html()替换
$.ajax({
    url: 'data.json',
    success: function(data) {
        $('#container').html(generateTable(data));
    }
});

if ($('#myTable').length === 0) {
    $('#container').append('<table id="myTable">...</table>');
}

var table = $('#myTable').detach();
$('#container').append(table);

var fragment = document.createDocumentFragment();
var table = $('<table>...</table>')[0];
fragment.appendChild(table);
$('#container')[0].appendChild(fragment);