Найти пары ключ-значение data() для каждого элемента
Каков наилучший способ просмотреть все jQuery data
пары ключ-значение для каждого элемента (в jQuery 2.x)?
Подход, ориентированный на выбор (например, $('*').data()
) явно не работает, потому что возвращаемое значение привязано к одному элементу.
Я знаю, что могу перебирать каждый элемент, проверяя каждый на наличие данных:
var allData = [];
$('html *').each(function() {
if($.hasData(this)) {
allData.push({ el: this, data: $(this).data() })
}
})
Это дает ожидаемый результат, но итерация каждого возможного ключа данных выглядит как обратный подход к этой проблеме.
Есть ли способ найти все данные элемента напрямую?
NB Меня интересует отладка, а не рабочий код.
1 ответ
Вы можете выбрать каждый элемент в теле с помощью $("body *")
и примените к нему jfuery 's .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