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

Question

Является ли хорошей практикой хранение связанной информации в теге HTML?

$("#my_div").append("<span id='info' boo='foo'/>"); 
$("#info").attr("boo"); 

Я столкнулся с такой техникой (и немного позаимствовал) в TAL (в ZPT), где вы могли бы использовать tal:attributes заявление, чтобы изменить HTML метки (например, передавая значение переменной boo от бэкэнда быть вынесены в итоговый документ в качестве значения атрибута):

<span id='info' tal:attributes='boo view/boo'> 

результат:

<span id='info' boo='foo'> 

Будет ли эта техника ломать документ когда-нибудь, или это безопасно по спецификации?

Answer 1

Правильный способ сделать это состоит в использовании данных- * атрибуты:

http://www.w3.org/TR/2011/WD-html5-20110525/elements.html#embedding-custom-non-visible-data-with-the-data-attributes

тангенциально, JQuery имеет специальный метод для работы с ними, а также. Например:

<p id='string' data-user_name='thedude'></p> 
$('#string').data('user_name') => "thedude" 
typeof $('#string').data('name') => "string" 

<p id='number' data-user_id='12345'</p> 
typeof $('#number').data('user_id') => "number" 

<p id='boolean' data-user_is_active='true'></p> 
typeof $('#boolean').data('user_is_active') => "boolean" 

<p id = 'json' data-user='{"name": "the dude", "id": "12345"}'></p> 
typeof $('#json').data('user') => "object" 
// embedding JSON is extremely useful in my experience 

Answer 2

w3.org позволяет в HTML5 использовать пользовательский пользовательские данные в HTML-теги;

Смотрите раздел:

3.2.3.9 Embedding custom non-visible data with the data-* attributes

Атрибут пользовательских данных является атрибут не в пространстве имен, чье имя начинается с строкой «data-», имеет по крайней мере один символ после дефиса [...]

Пример:

<ol> 
<li data-length="2m11s">Beyond The Sea</li> 
... 
</ol> 

Итак, я скажу, что это приемлемая практика для HTML5.