Есть ли способ создать свой собственный элемент HTML?

Question

Есть ли способ создать свой собственный элемент HTML?Я хочу сделать специально разработанный флажок.

Я полагаю, что такая вещь была бы сделана в JavaScript.Что-то похожее на document.createHTMLElement, но возможность создавать свой собственный элемент (и тег).

Answer 1

Нет, нет.

Элементы HTML ограничены тем, что будет обрабатывать браузер.То есть, если вы создали собственный плагин firefox, а затем обработали его специальным тегом, то вы «могли бы» это сделать, для разных интерпретаций «делать это».Список всех элементов для конкретной версии HTML можно найти здесь: http://www.w3.org/TR/html4/index/elements.html

Возможно, однако, вы на самом деле не хотите.Если вы хотите «объединить» несколько существующих элементов таким образом, чтобы они работали вместе, то вы можете сделать это с помощью самого JavaScript.Например, если вы хотите установить флажок, чтобы при щелчке отобразить раскрывающийся список где-то, заполненный различными вещами, вы можете это сделать.и мы можем помочь в дальнейшем.

Answer 2

Да, вы можете создавать свои собственные теги. Вам необходимо создать схему и импортировать ее на свою страницу, а также написать слой JavaScript для преобразования новых тегов в существующие теги HTML.

Примером является fbml ( Язык разметки Facebook ), который включает в себя схему и слой JavaScript, который написал Facebook. Смотрите это: Протокол Open Graph .

С ее помощью вы можете легко создать кнопку «Нравится»:

<fb:like href="http://developers.facebook.com/" width="450" height="80"/>

Answer 3

Вам нужно написать собственный тип документа и / или использовать собственное пространство имен для этого.

http://msdn.microsoft.com/en-us/magazine/cc301515.aspx

Answer 4

Самый простой способ - написать плагин в Jquery (или Dojo, MooTools, выбрать один). В случае jQuery вы можете найти здесь некоторые плагины http://plugins.jquery.com/ и использовать их в качестве примера.

Answer 5

Это правильный вопрос, но я думаю, что название игры со стороны пользовательского интерфейса - прогрессивная разметка.Создайте допустимые w3-совместимые теги и затем стилизуйте их соответствующим образом с помощью JavaScript (в моем случае Jquery или Dojo) и CSS.Хорошо написанный блок CSS можно многократно использовать (мой любимый случай - Jquery UI с themeroller) и стилизовать практически любой элемент на странице, добавив всего одно или два слова к объявлению класса.

Вот несколько хороших Jquery / Javascript / CSS решений, которые относительно просты:

http://www.filamentgroup.com/examples/customInput/ http://aaronweyenberg.com/90/pretty-checkboxes-with-jquery http://www.protofunc.com/scripts/jquery/checkbox-radiobutton/

Вот спецификации для предстоящего (имногообещающее) Обновление JqueryUI для элементов формы: http://wiki.jqueryui.com/Checkbox

Если вам нужно проверить ввод, это простой способ получить встроенную проверку с помощью одного тега класса или идентификатора: http://www.position -absolute.com / article / jquery-form-validator-потому что-form-validation-is-a-mess /

Хорошо, так что мое решение - это не 10-символьное, однострочное решение.Тем не менее, если не учитывать код Jquery, каждый отдельный тег не будет намного больше, чем:

<input type="checkbox" id="theid">

Так что, хотя будет средний кусок кода Jquery, отдельные элементы будут очень маленькими, что важноесли вы повторяете это 250 раз (программно), как того требует мой последний проект.Легко кодировать, хорошо деградирует, хорошо проверяет, и поскольку прогрессивная разметка будет на стороне пользователя, практически не будет стоить на стороне сервера.

Мой текущий проект в Symfony - не мой выбор -который использует сложные, громоздкие серверные теги для рендеринга элементов формы, проверки, выполнения javascript onclick, style и т. д. Это похоже на то, о чем вы сначала просили ... и позвольте мне сказать, что это CLUNKY.Один тег для вызова ссылки может быть длиной в 10 строк кода!Будучи вынужденным сделать это, я не фанат.

Answer 6

Нет, нет. Более того, это не разрешено в HTML5.

Взгляните на Достаточно SDK Библиотека графического интерфейса JavaScript, которая включает любые пользовательские элементы или пространства имен событий на стороне клиента (таким образом, XUL, например, был реализован там) без вмешательства в правила HTML5.

Посмотрите, например, как реализован элемент масштаба XUL: http://github.com/clientside/amplesdk/blob/master/ample/languages/xul/elements/scale.js и его таблица стилей по умолчанию: http://github.com/clientside/amplesdk/blob/master/ample/languages/xul/themes/default/input.css

Answer 7

С появлением стандарта W3 Web Components, в частности спецификации Custom Elements , теперь вы можете создавать свои собственные пользовательские элементы HTML и регистрировать их в анализаторе с помощью метода document.register() DOM. 1004 *

X-Tag - это полезная библиотека сахаров, разработанная Mozilla, которая упрощает работу с веб-компонентами: X-Tags.org

Answer 8

Hm.Первая мысль заключается в том, что вы можете создать свой собственный элемент и затем выполнить преобразование с помощью XSLT в действительный HTML.