Help us understand the problem. What is going on with this article?

HTML5 の各タグの constructor を調べる

More than 1 year has passed since last update.

概要

  • HTML5 で使用可能なタグから生成された DOM の constructor 名を調べて見ました。

HTMLElement 以外を継承しているもの

Tag Name HTMLElement
<A> HTMLAnchorElement
<AREA> HTMLAreaElement
<AUDIO> HTMLAudioElement
<BASE> HTMLBaseElement
<BLOCKQUOTE> HTMLQuoteElement
<BODY> HTMLBodyElement
<BR> HTMLBRElement
<BUTTON> HTMLButtonElement
<CANVAS> HTMLCanvasElement
<CAPTION> HTMLTableCaptionElement
<COL> HTMLTableColElement
<COLGROUP> HTMLTableColElement
<DATA> HTMLDataElement
<DATALIST> HTMLDataListElement
<DEL> HTMLModElement
<DETAILS> HTMLDetailsElement
<DIV> HTMLDivElement
<DL> HTMLDListElement
<EMBED> HTMLEmbedElement
<FIELDSET> HTMLFieldSetElement
<FORM> HTMLFormElement
<H1> HTMLHeadingElement
<H2> HTMLHeadingElement
<H3> HTMLHeadingElement
<H4> HTMLHeadingElement
<H5> HTMLHeadingElement
<H6> HTMLHeadingElement
<HEAD> HTMLHeadElement
<HR> HTMLHRElement
<HTML> HTMLHtmlElement
<IFRAME> HTMLIFrameElement
<IMG> HTMLImageElement
<INPUT> HTMLInputElement
<INS> HTMLModElement
<LABEL> HTMLLabelElement
<LEGEND> HTMLLegendElement
<LI> HTMLLIElement
<LINK> HTMLLinkElement
<MAP> HTMLMapElement
<MENU> HTMLMenuElement
<META> HTMLMetaElement
<METER> HTMLMeterElement
<OBJECT> HTMLObjectElement
<OL> HTMLOListElement
<OPTGROUP> HTMLOptGroupElement
<OPTION> HTMLOptionElement
<OUTPUT> HTMLOutputElement
<P> HTMLParagraphElement
<PARAM> HTMLParamElement
<PICTURE> HTMLPictureElement
<PRE> HTMLPreElement
<PROGRESS> HTMLProgressElement
<Q> HTMLQuoteElement
<SCRIPT> HTMLScriptElement
<SELECT> HTMLSelectElement
<SLOT> HTMLSlotElement
<SOURCE> HTMLSourceElement
<SPAN> HTMLSpanElement
<STYLE> HTMLStyleElement
<TABLE> HTMLTableElement
<TBODY> HTMLTableSectionElement
<TD> HTMLTableCellElement
<TEMPLATE> HTMLTemplateElement
<TEXTAREA> HTMLTextAreaElement
<TFOOT> HTMLTableSectionElement
<TH> HTMLTableCellElement
<THEAD> HTMLTableSectionElement
<TIME> HTMLTimeElement
<TITLE> HTMLTitleElement
<TR> HTMLTableRowElement
<TRACK> HTMLTrackElement
<UL> HTMLUListElement
<VIDEO> HTMLVideoElement

HTMLElement だったもの。

Tag Name HTMLElement
<ABBR> HTMLElement
<ADDRESS> HTMLElement
<ARTICLE> HTMLElement
<ASIDE> HTMLElement
<B> HTMLElement
<BDI> HTMLElement
<BDO> HTMLElement
<CITE> HTMLElement
<CODE> HTMLElement
<DD> HTMLElement
<DFN> HTMLElement
<DT> HTMLElement
<EM> HTMLElement
<FIGCAPTION> HTMLElement
<FIGURE> HTMLElement
<FOOTER> HTMLElement
<HEADER> HTMLElement
<I> HTMLElement
<KBD> HTMLElement
<MAIN> HTMLElement
<MARK> HTMLElement
<NAV> HTMLElement
<NOSCRIPT> HTMLElement
<RB> HTMLElement
<RP> HTMLElement
<RT> HTMLElement
<RTC> HTMLElement
<RUBY> HTMLElement
<S> HTMLElement
<SAMP> HTMLElement
<SECTION> HTMLElement
<SMALL> HTMLElement
<STRONG> HTMLElement
<SUB> HTMLElement
<SUMMARY> HTMLElement
<SUP> HTMLElement
<U> HTMLElement
<VAR> HTMLElement
<WBR> HTMLElement

HTMLUnknownElement だったもの。

  • HTML リファレンスサイトで見たものの、Chrome では HTMLUnknownElement と表示されました。
Tag Name HTMLElement
<COMMAND> HTML5で廃止 HTMLUnknownElement
<KEYGEN> HTMLUnknownElement

ご協力のお願い

  • 抜けてるタグや改定で追加・廃止されたものがあった場合は随時編集しますので、ご連絡いただけると嬉しいです。

ノート

  • HTMLDivElement の実装は何もない、とどこかの記事で見ました。(要再確認)

  • HTMLElement を継承しているものは特別な機能をもたず、以下のいずれかの役割を持ちます。

    (1) ディフォルトの CSS を持たせる。(<sup>, <sub> など)
    (2) HTML にセマンティックな意味を持たせる。(<nav> など)

  • 近い将来に私 Stew Eucen の GitHub で公開されるライブラリを見た時、この記事が意味するところが判明するでしょう。お楽しみに。

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away