18

Можно ли самому создавать свои нестандартные HTML-теги? Например <page></page>

1
  • На этот вопрос и так можно дать однозначный ответ.
    – Qwertiy
    11 сен 2015 в 14:53

3 ответа 3

20

По спецификации: да, можно, но их имя должно содержать хотя бы один дефис.

Реально: да, можно - браузеры всё съедят. За исключением старых IE, где нужно вызывать document.createElement для всех незнакомых ему тегов, чтобы они не стали самозакрывающимися.

А ещё, можно создавать теги в своих пространствах имён.

Спецификация.

3
11

Да, разумеется. http://w3c.github.io/webcomponents/spec/custom/

Вот легковесный полифил document.registerElement для всех актуальных браузеров: https://github.com/WebReflection/document-register-element

Рекомендую его, т.к. сам активно использую в продакшене.

var MyElement = document.registerElement(
  'my-element',
  {
    prototype: Object.create(
      HTMLElement.prototype, {
      createdCallback: {value: function() {
        console.log('here I am ^_^ ');
        console.log('with content: ', this.textContent);
      }},
      attachedCallback: {value: function() {}},
      detachedCallback: {value: function() {}},
      attributeChangedCallback: { value: function(name, previousValue, value ) {}}
    })
  }
);

Кастомные теги повышают семантичность и рекомендуются к применению W3C и Google. Единственная проблема с ними - непрохождение стандартного валидатора.

Проблем со стилями на практике не наблюдал ни разу.

Обратите внимание, что по стандарту, кастомные теги должны содержать в названии черту -, т.е. в вашем случае <my-page>

1
  • 1
    Стоит добавить, что перед тем как придумывать свои теги, стоит внимательно ознакомиться с функцией каждого из стандартных, в т.ч. новых тегов html5: w3schools.com/html/html5_new_elements.asp 11 сен 2015 в 14:50
2

Можно, но к нему не будут применяться стили в некоторых старых браузерах, тут можно почитать как добавить поддержку, но я бы не советовал выдумывать такие велосипеды

1
  • 4
    надо срочно рассказать авторам Angular, Vue, React, knockout и пр 11 сен 2015 в 14:30

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.