Можно ли вставить свой атрибут в HTML-тег?

243

12 декабря 2016, 10:13

Можно ли вставить свой атрибут в HTML-тег и потом обратиться к нему?

Например, добавляю атрибут group :

first <input type="radio" id="qwerty1" group="1" onClick="myclick();"><br>
second <input type="radio" id="qwerty2" group="2" onClick="myclick();"><br>
third <input type="radio" id="qwerty3" group="3" onClick="myclick();"><br>
<script>
function myclick() {
  alert(this.group);
}
</script>

Answer 1

"Свой" атрибут кинуть можно (element.setAttribute(name, value)), но валидацию от любого нормального валидатора кода он с треском провалит. Так же ожидаемы глюки и некорректная работа, особенно в старых браузерах.
Хранение данных именно для конкретного атрибута всегда было занозой в... под ногтями разработчиков.
В HTML пятой редакции помимо решения кучи других столь же насущных проблем был придуман атрибут, который отвечает стандартам и позволяет хранить сколь угодно пользовательских данных (но перебарщивать, всё же, не стоит - моветон это).
"Data: Да придёт (или пришёл :)) спаситель"!
Example:

HTML5:
<span data-id='123' data-group-name='Terminators'>Group 123</span>
JS:
var data = document.querySelector('span').dataset;
var idGroup = data.id;
var nameGroup = data.groupName;