Почему я должен добавлять свои пользовательские атрибуты с помощью "data-"?

Таким образом, любой пользовательский атрибут данных, который я использую, должен начинаться с "data -":

<li class="user" data-name="John Resig" data-city="Boston"
     data-lang="js" data-food="Bacon">
  <b>John says:</b> <span>Hello, how are you?</span>
</li>

Будет ли что-то плохое, если я просто проигнорирую это? То есть:.

<li class="user" name="John Resig" city="Boston"
     lang="js" food="Bacon">
  <b>John says:</b> <span>Hello, how are you?</span>
</li>

Я полагаю, что одна из плохих вещей заключается в том, что мои пользовательские атрибуты могут вступать в конфликт с атрибутами HTML со специальными значениями (например, name), но помимо этого возникает проблема с просто написанием "example_text" вместо "data-example_text" "? (Это не подтвердит, но кому это важно?)

Ответ 1

Есть несколько преимуществ для сохранения пользовательских атрибутов с префиксом данных - *.

  • Это гарантирует, что не будет никаких столкновений с расширениями HTML в будущих выпусках. Это проблема, которая уже в некоторой степени встречается с некоторыми из новых атрибутов, введенных в HTML5, где существующие сайты используют атрибуты с тем же именем и ожидают различного и несовместимого пользовательского поведения. (например, атрибут required на элементах input, как известно, имел некоторые столкновения на некоторых популярных сайтах в прошлом)

  • После того как браузер поддерживает эту функцию, они предоставят более удобный DOM API для доступа к этим атрибутам из сценариев.

  • Они дают четкое указание, какие атрибуты являются настраиваемыми атрибутами, а какие - стандартизованными атрибутами. Это не только помогает валидаторам, позволяя им разрешать любые атрибуты с данными, но при этом выполнять эффективную проверку ошибок для других атрибутов (например, улавливать опечатки), это также помогает сделать этот аспект исходного кода более понятным для тех, кто его читает, включая людей которые могут работать на веб-сайте после оригинального автора.

Ответ 2

Согласно John Resig, вся цель добавления этих атрибутов пользовательских данных в HTML5 sepcs заключается в том, чтобы разрешить встраивание пользовательских данных в HTML, сохраняя при этом действительность.

Если вы не заботитесь о проверке (и, как вы сказали, ваши пользовательские атрибуты не сталкиваются с существующими атрибутами HTML, такими как name, id, style и т.д.), то, 't должен использовать префикс data-. Но учитывая, что это не огромная стоимость для написания действительного, совместимого кода, я не понимаю, почему вы этого не сделаете.