скрытые данные в html5
В спецификации html5 сейчас есть любопытное свойство элементов dataset
, идущее в комплекте с атрибутами data-*
. Эта парочка предназначена для удобного встраивания скрытых данных в документ. Например, яваскрипту, обрабатывающему элементы списка, могут пригодиться внутренние системные айдишники этих объектов, но сейчас у разработчика нет нормального способа разместить эти данные в документе. Конечно, числа можно с какими-то особыми префиксами запихать в атрибуты id
или class
, но я бы не стал хвастаться таким подходом. Кроме того, с более сложными данными это не прокатит. Вариант включать эти данные в скрытые элементы нравится мне ещё меньше.
Теперь нам предлагается, что атрибут data-name
будет доступен как свойство name
в свойстве dataset
самого элемента. Подробнее об этом в посте «HTML 5 data- Attributes» Джона Резига, который и сподвиг меня на действие. (Кстати, там в комментах любопытный флейм.) Но на пути к счастью стоит обычная проблема: браузеры эту фичу ещё не поддерживают. И решается она обычным способом — небольшой доработкой фреймворка.
Element.addMethods({
getDataset: function(element) {
if (element.dataset) return element.dataset;
var match, dataset = {};
$A(element.attributes).each(function(attr){
if (attr.nodeName.startsWith('data-'))
dataset[attr.nodeName.substring(5)] = attr.nodeValue;
});
return element.dataset = dataset;
}
});
Конечно, круче было бы использовать геттер, но рано ещё : (
update: вместо localName
нужно использовать nodeName