如何删除元素上的所有数据属性？

我一直在 stackoverflow 上检查很多很多帖子，但是，即使许多解决方案应该有效，但它对我来说仍然不起作用。

我在引导程序中有一个模式，其中有引导程序复选框列表（<label><input> style).

每个复选框都有一组数据属性直接从 AJAX 请求设置因此，这不是通过 jQuery 设置的。

在我的情况下，我需要在切换复选框时从复选框中删除所有数据属性并添加其他数据属性。

但问题是我无法删除它们。

我首先尝试使用jQuery.removeData()，但后来我读到它实际上仅当至少其中一个数据属性已通过 jQuery 设置时才删除数据属性，因此这不是我的情况。

所以，我检查了一下，发现我应该使用jQuery.removeAttr()原型并删除每个数据元素。

所以，我的案例是这样的：

$('.modal_day_checkbox').on('change', function(){
        if ($(this).is(':checked')) {
            removeAllData($(this));
            $(this).data('newid', 'test_id');
            console.log($(this).data());
        }
        else {
            removeAllData($(this));
            $(this).data('testID', 'ID_NEW');
            console.log($(this).data());
        }
    });

而且，为了拥有干净的代码，我实现了函数removeAllData：

function removeAllData(object) {
        $.each(object.data(), function(i, v) {
            object.removeAttr("data-"+i);
            console.log('removing: '+'data-'+i);
        });
    }

它只是循环遍历对象来检查它具有哪些数据属性，并且应该将其删除。

令人惊讶的是，结果是这样的：

任何想法？

尝试调用 jQuery.removeData功能以及您的removeAllData功能：

function removeAllData(object) {
    $.each(object.data(), function(i, v) {
        object.removeAttr("data-"+i);
        console.log('removing: '+'data-'+i);
    });
    object.removeData();  // clear the cache too
}

jQuery 维护一个单独的对象，其中data-foo值一旦被访问就会被缓存（并且在哪里writes to .data被存储）并且当您调用时缓存不会被清除.removeAttr('data-foo').