Каковы причины НЕ использовать пользовательские теги HTML?

Учитывая текущие спецификации HTML5, которые позволяют создание пользовательских HTML-элементов (если их имя содержит тире), и тот факт, что веб-компоненты, похоже, останутся функцией, которая останется, я хотел бы знать почему создание собственных пользовательских HTML-элементов осуждается?

Обратите внимание, что я не спрашиваю, использовать ли веб-компоненты, которые все еще являются движущейся целью, и даже с такими отличными полифиллами, как Polymer, они могут быть еще не готовы к производству. Я спрашиваю о создании ваших собственных пользовательских тегов HTML и их стилизации без привязки к ним каких-либо API-интерфейсов JS.


person Maciej Gurban    schedule 03.11.2014    source источник
comment
может быть идентичен stackoverflow.com/questions/18177472/   -  person NullPoiиteя    schedule 03.11.2014
comment
@obiNullPoiиteяkenobi Не обманщик. Здесь речь идет о легальных и действительных пользовательских элементах HTML5 (их использование определено в спецификациях). Другой вопрос и его ответы не касаются этой проблемы.   -  person Adi    schedule 03.11.2014
comment
просто чтобы добавить немного сахара: каковы причины использования пользовательских тегов?   -  person rafaelcastrocouto    schedule 03.11.2014
comment
У каждого человека были бы свои причины. Мой вопрос был направлен на то, чтобы найти реальные недостатки их использования. Поначалу это кажется странным, и поэтому большинство людей не решаются их реализовать, но кроме этого?   -  person Maciej Gurban    schedule 04.11.2014


Ответы (2)


Краткий ответ: я не слышал каких-либо веских причин избегать их.

Тем не менее, вот некоторые повторяющиеся аргументы, которые я слышал:

  • Не работает в старом IE (просто document.createElement("my-tag"); должно это исправить).
  • Глобальные конфликты пространств имен (то же самое относится к именам классов и кастомным элементам в целом).
  • Производительность селектора CSS (дох, это последнее, о чем вам стоит беспокоиться).
  • Разделение функциональности, смысла и представления. На самом деле это единственный аргумент, который я слышал, что ИМХО имеет под собой веские основания. Вам, конечно, лучше с семантическим HTML (поисковые системы и все такое), но если вы собирались использовать div в противном случае, я не понимаю, почему вы не можете использовать вместо этого пользовательский тег.
person quinnirill    schedule 03.11.2014
comment
Однако не будут ли пользовательские теги способствовать лучшему разделению между функциональностью и представлением? Вместо div с классами, определяющими отдельно представление и функцию, вы получаете имя элемента, которое уже передает его функциональность, и просто добавляете презентационный класс или наоборот? - person Maciej Gurban; 03.11.2014
comment
Это зависит. Я обнаружил, что по мере того, как проекты становятся больше, легче содержать изменения, когда ваш стиль никоим образом не связан со структурой DOM. У вас может быть два типа модальных диалогов, технически оба modal-dialog, но используемые в другом контексте, и вы не хотите, чтобы изменения в одном стиле влияли на другой. Поэтому мне лично нравится использовать классы для стилей, чтобы избежать максимально возможной зависимости стилей от структуры DOM и наоборот. Я настоятельно рекомендую прочитать cssguidelin.es , в нем много хороших моментов. - person quinnirill; 03.11.2014
comment
Спасибо за ссылку! Хотя я бы не стал выступать за использование структуры DOM в качестве основного способа определения представления или функций элемента, я считаю, что определенные способы связывания, например, родительского класса с его дочерним потоком макета, весьма полезны для читаемости кода и простоты использования. Зависит от случая. - person Maciej Gurban; 03.11.2014
comment
Точно. Эти вещи не черно-белые. Я обычно использую только теги стиля, если вариант использования достаточно прост. - person quinnirill; 03.11.2014

Одним из аргументов против пользовательских тегов является их предполагаемая несовместимость с программами чтения с экрана. Эту проблему можно решить с помощью атрибутов WAI-ARIA.

Существует проблема в IE11, из-за которой нарушается макет таблицы, если внутрь вставляется настраиваемый элемент без свойства отображения. ячейка таблицы. Проверьте код плункера. Поэтому безопаснее всего объявлять все новые элементы явно, например так:

new-element {
    display: block;
}
person Maciej Gurban    schedule 03.11.2014