0

查看每个元素（在 jQuery 2.x 中）中的所有 jQuerydata键值对的最佳方法是什么？

面向选择的方法（例如$('*').data()）显然不起作用，因为返回值与单个元素相关联。

我知道我可以遍历每个元素，检查每个元素的数据：

var allData = [];
$('html *').each(function() {
    if($.hasData(this)) {
        allData.push({ el: this, data: $(this).data() })
    }
})

JSFiddle

这确实产生了预期的输出，但是对每个可能的数据键进行迭代感觉就像是解决这个问题的一种倒退方法。

有没有办法直接找到所有元素数据？

注意我对调试感兴趣，而不是生产代码。

4

1 回答 1

1

$("body *")您可以使用 jQuery 的.filter()选择正文中的每个元素并对其应用。工作示例：

var $elementsContainingData $("body *").filter(function() {
    if($.hasData(this)) return this;  
});
console.log($elementsContainingData);

编辑

正如@spokey 之前提到的，jQuery 对象中有一个名为“cache”的内部变量：$.cache.

该变量由一堆对象组成，其中包含“数据”或“事件”等键：

5: Object
data: Object
events: Object
handle: function (a){return typeof m===K||a&&m.event.triggered===a.type?void     0:m.event.dispatch.apply(k.elem,arguments)}
__proto__: Object

您可以遍历该对象并过滤数据：

var filteredCache = $.each($.cache,function() {
        if(typeof this["data"] === "object") return this;
    });

这是一个工作示例加上一个函数，用于将这些东西合并到一个更方便的对象中，该对象仅包含 dataKey => dataValue 配对：Fiddle

编辑

如评论中所述，此解决方案在 jQuery 版本 2.x 中不起作用，因为$.cache已弃用。

我的最后一个建议是为 jQuerys 数据函数创建一个钩子，以便在$.dataCache = {};每次data()调用时扩展自己的对象。扩展、替换或添加 jQuerys 函数是通过访问$.fn.functionName：

$.fn.data = function(fn,hook) {
    return function() {
        hook.apply(this,arguments);
        return fn.apply(this,arguments);
    }
}($.fn.data,function(key,value) {
    var objReturn = {};
    objReturn[key] = value;
    $.extend($.dataCache,objReturn);
});

这在 jQuery 版本 2 中也很有效：Fiddle

于 2014-07-11T15:38:06.860 回答