Могу ли я хранить пользовательские атрибуты в HTML DOM как запись базы данных?

Question

При разработке для браузеров FF3 и IE6 / 7 с jQuery, есть ли проблемы с совместимостью при установке пользовательских атрибутов для тегов HTML?

Во-первых, мне известна функция jQuery data(), и она, по сути, делает то, что я хочу, но данные не выдерживают функцию clone(). Эта проблема возникает при использовании подключаемых плагинов пользовательского интерфейса jQuery, поскольку они клонируют элементы DOM во время перетаскивания. Для целей этого вопроса мне нужна альтернатива data().

Я хочу сохранить данные между операциями перетаскивания. Я хочу иметь возможность вводить данные в элемент DOM, который перемещается во время операции перетаскивания. Для этого я могу создать дочерние элементы HTML для имитации записи в базе данных. Быстрые эксперименты показывают, что у Firefox нет проблем с использованием любых имен атрибутов, которые я хочу хранить в полях данных. Однако спецификация HTML 4 гласит, что определенные теги могут содержать только определенные имена атрибутов. Не вызовет ли заполнение DOM нестандартными атрибутами проблемы несовместимости с упомянутыми выше браузерами?

Answer 1

Посмотрите на этот похожий вопрос, который я задал некоторое время назад: Могу ли я просто создать атрибуты для моих HTML-тегов?

Лично мне не очень нравятся предлагаемые ответы по размещению всех ваших данных в атрибуте класса. Кажется, просто ... неправильно, ты знаешь? По моему опыту, хотя ваша страница не будет действительной, если вы создадите атрибуты, я все равно это сделаю. Протестируйте его в 4 основных браузерах, и если оно работает, кого это волнует?

Лучшее решение, которое я могу придумать, это решение, которое недействительно сейчас , но будет в HTML5, так что это хорошо. Как подсказывает ms2ger в этом другом вопросе, добавьте к вашим пользовательским атрибутам data-

http://www.whatwg.org/specs/web-apps/current-work/multipage/dom.html#embedding-custom-non-visible-data

Answer 2

Это относительно неизвестно, но чертовски полезно: Плагин метаданных jQuery . Это позволит вам хранить данные в именах классов для поиска. В основном он используется для плагина валидации, но действительно может быть адаптирован к любому сценарию.

Удачи всем, с кем вы работаете.

Answer 3

Новые атрибуты данных HTML 5 могут быть тем, что вы ищете.

http://ejohn.org/blog/html-5-data-attributes/

http://dev.w3.org/html5/spec/Overview.html#custom

Answer 4

В отсутствие какого-либо стандартного способа сделать это в HTML4 у меня возникнет соблазн создать скрытый элемент, соответствующий моему перетаскиваемому элементу, и сохранить в нем связанные данные. Назовите скрытый элемент относительно перетаскиваемого, чтобы вы могли легко найти информацию для него. Следующее расширение реализует это с помощью скрытого диапазона. Примечание: при тестировании я не мог повторить ваши проблемы с перетаскиваемыми элементами - мне казалось, что data () работает нормально, но я не тестировал его с различными плагинами, только UI.Draggable.

Использование:

$('#draggableDiv').externalData('key','data');
var d = $('#draggableDiv').externalData('key');

jQuery.fn.externalData = function(key, data) {
    var value = this;
    this.each( function() {
        var id = this.id+'_external_data';
        var elem = jQuery('#'+id+':first');
        if (elem.size() == 0) {
            elem = $('<span style="display: none;" id="' + id + '"></span>"' );
            elem.appendTo(document.body);
        }
        if (data) {
            elem.data(key,data);
        }
        else {
            value = elem.data(key);
            return false;
        }
    });
    return value;
};

Answer 5

Посмотрите на http://www.persvr.org/

Persevere имеет новый собственный механизм хранения объектов под названием JavaScriptDB, обеспечивающий масштабируемость и производительность высокого класса

http://ajaxian.com/archives/perseveres-javascriptdb-impressive-json-performance