Как javascript Array хранится в атрибуте HTML5 data?
Я пробовал каждую вариацию JSON.stringify катионов и экранирующих символов.
Каков точный метод хранения массива и его повторного поиска?
примечание
Я создаю массив с [ $("#firstSelectedElement").val(), $("#secondSelectedElement").val() ]. Я извлекаю id="storageElement" data-storeIt="stuff" с помощью $("#storageElement").data('storeit').
Я никогда не могу получить данные как истинные Array, только Array символов.
Оказалось, что вы можете использовать html-экранированные символы в элементе data, чтобы иметь json-подобный массив (закодированные кавычки):
<div id="demo" data-stuff='["some", "string", "here"]'></div>
И затем в javascript получите его без дополнительной магии:
var ar = $('#demo').data('stuff');
Отметьте fiddle вне.
Отредактировано (2017)
Вам не нужно использовать html экранированные символы в атрибуте data.
<div id="demo" data-stuff='["some", "string", "here"]'></div>
Проверьте этот новый fiddle вне.
Это зависит от того, какой тип данных вы храните в массиве. Если это просто строки (как кажется), и у вас есть персонаж, который, как вы знаете, никогда не будет частью ваших данных (например, запятая в моем примере ниже), я бы забыл о сериализации JSON и просто использовал string.split:
<div id="storageElement" data-storeIt="stuff,more stuff"></div>
Затем при извлечении:
var storedArray = $("#storageElement").data("storeIt").split(",");
Он будет обрабатывать бит лучше, чем использование JSON. Он использует меньше символов и менее "дорогой", чем JSON.parse.
Но, если вам нужно, ваша реализация JSON будет выглядеть примерно так:
<div id="storageElement" data-storeIt='["hello","world"]'></div>
А для извлечения:
var storedArray = JSON.parse($("#storageElement").data("storeIt"));
Обратите внимание, что в этом примере нам пришлось использовать полукавы (') вокруг свойства data-storeIt. Это связано с тем, что синтаксис JSON требует от нас использовать кавычки вокруг строк в своих данных.
Атрибут данных HTML5 может хранить только строки, поэтому, если вы хотите сохранить массив, вам необходимо его сериализовать. JSON будет работать, и похоже, что вы на правильном пути. Вам просто нужно использовать JSON.parse() после получения сериализованных данных:
var retrieved_string = $("#storageElement").data('storeit');
var retrieved_array = JSON.parse(retrieved_string);
Пересматривая документацию api, jQuery должен попытаться автоматически преобразовать кодированную строку JSON при условии, что она правильно закодирована. Можете ли вы привести пример значения, которое вы храните?
Также обратите внимание, что атрибут данных HTML5 и методы jQuery .data() - это две разные вещи. Они взаимодействуют, но jQuery более мощный и может хранить любой тип данных. Вы можете просто сохранить массив javascript напрямую, используя jQuery, без его сериализации. Но если вам нужно иметь его в самой разметке как атрибут данных HTML5, тогда вы ограничены только строками.
Для записи он не работал с закодированными объектами для меня, но кажется, что для анализа в качестве объекта атрибут данных должен быть хорошо сформированным объектом JSON.
Итак, я смог использовать объект с помощью:
data-myarray="{"key": "value"}"
или просто использовать одиночные кавычки:
data-myobject='{"key1": "value1", "key2": value2}'
Время веселиться!: D
Вы можете сохранить любой объект в node следующим образом:
$('#storageElement').data('my-array', ['a', 'b', 'c']);
var myArray = $('#storageElement').data('my-array');