HTML4 与 HTML5 的区别

最新推荐文章于 2023-05-03 17:57:33 发布
最新推荐文章于 2023-05-03 17:57:33 发布
阅读量1.3k 收藏
点赞数
分类专栏： 其它 文章标签： html5

Abstract

"Differences from HTML4" describes the differences of the HTML specification from those of HTML4.

Table of Contents

1 Introduction

1.1 Scope of This Document

This document covers the WHATWG HTML standard. It does not cover the W3C HTML5 or W3C HTML5.1 specifications. [HTML] [HTML5] [HTML5NIGHTLY]

1.2 History of HTML

HTML has been in continuous evolution since it was introduced to the Internet in the early 1990s. Some features were introduced in specifications; others were introduced in software releases. In some respects, implementations and Web developer practices have converged with each other and with specifications and standards, but in other ways, they have diverged.

HTML4 became a W3C Recommendation in 1997. While it continues to serve as a rough guide to many of the core features of HTML, it does not provide enough information to build implementations that interoperate with each other and, more importantly, with Web content. The same goes for XHTML1, which defines an XML serialization for HTML4, and DOM Level 2 HTML, which defines JavaScript APIs for both HTML and XHTML. HTML replaces these documents. [DOM2HTML] [HTML4] [XHTML1]

The HTML specification reflects an effort, started in 2004, to study contemporary HTML implementations and Web content. The specification:

  1. Defines a single language called HTML which can be written in HTML syntax and in XML syntax.

  2. Defines detailed processing models to foster interoperable implementations.

  3. Improves markup for documents.

  4. Introduces markup and APIs for emerging idioms, such as Web applications.

1.3 Open Issues

See open issues in Bugzilla. The specification also has annotation boxes in the margin which can link to bugs.

1.4 Backward Compatibility

HTML is defined in a way that is backward compatible with the way user agents handle content. To keep the language relatively simple for Web developers, several older elements and attributes are not included, as outlined in the other sections of this document, such as presentational elements that are better handled using CSS.

User agents, however, will always have to support these older elements and attributes. This is why the HTML specification clearly separates requirements for Web developers (referred to as "authors" in the specification) and user agents; for instance, this means that Web developers cannot use the isindex or the plaintext element, but user agents are required to support them in a way that is compatible with how these elements need to behave for compatibility with Web content.

Since HTML has separate conformance requirements for Web developers and user agents there is no longer a need for marking features "deprecated".

1.5 Development Model

The HTML4 specification reached Recommendation status before it was completely implemented in user agents. HTML4 still is not completely implemented, because it contains various bugs that have been fixed in the current HTML specification, which user agents are much closer to implementing than HTML4.

The HTML standard is under continual development where bugs are fixed and new features are introduced over time. Features can also be removed from the specification if they lack implementor interest, are not being used by Web developers, or for other reasons.

2 Syntax

HTML defines a syntax, referred to as "the HTML syntax", that is mostly compatible with HTML4 and XHTML1 documents published on the Web, but is not compatible with the more esoteric SGML features of HTML4, such as processing instructions and shorthand markup as these are not supported by most user agents. Documents using the HTML syntax are served with the text/html media type.

HTML also defines detailed parsing rules (including "error handling") for this syntax which are largely compatible with HTML4-era implementations. User agents have to use these rules for resources that have the text/html media type. Here is an example document that conforms to the HTML syntax:

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Example document</title>
  </head>
  <body>
    <p>Example paragraph</p>
  </body>
</html>

The other syntax that can be used for HTML is XML. This syntax is compatible with XHTML1 documents and implementations. Documents using this syntax need to be served with an XML media type (such as application/xhtml+xml or application/xml) and elements need to be put in the http://www.w3.org/1999/xhtml namespace following the rules set forth by the XML specifications. [XML] [XMLNS]

Below is an example document that conforms to the XML syntax of HTML.

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Example document</title>
  </head>
  <body>
    <p>Example paragraph</p>
  </body>
</html>

2.1 Character Encoding

For the HTML syntax, Web developers are required to declare the character encoding. There are three ways to do that:

  • At the transport level; for instance, by using the HTTP Content-Type header.

  • Using a Unicode Byte Order Mark (BOM) character at the start of the file. This character provides a signature for the encoding used.

  • Using a meta element with a charset attribute that specifies the encoding within the first 1024 bytes of the document; for instance, <meta charset="UTF-8"> could be used to specify the UTF-8 encoding. This replaces the need for <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> although that syntax is still allowed.

For the XML syntax, Web developers have to use the rules as set forth in the XML specification to set the character encoding.

2.2 The Doctype

The HTML syntax requires a doctype to be specified to ensure that the browser renders the page in standards mode. The doctype has no other purpose. [DOCTYPE]

In HTML4, it was possible to use doctypes that were syntactically correct but still trigger quirks mode (e.g. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">, without the URL).

If you were using no doctype or a quirky doctype and switch to a standards mode doctype, you will most likely run into differences between the modes. For example, in quirks mode, classes and IDs in Selectors are case-insensitive and CSS <length>s do not require a unit. For more examples, please refer to What happens in Quirks Mode?.

The doctype declaration for the HTML syntax is <!DOCTYPE html> and is case-insensitive. Doctypes from earlier versions of HTML were longer because the HTML language was SGML-based and therefore required a reference to a DTD. This is no longer the case and the doctype is only needed to enable standards mode for documents written using the HTML syntax. Browsers already do this for <!DOCTYPE html>.

To support legacy markup generators that cannot generate the preferred short doctype, the doctype <!DOCTYPE html SYSTEM "about:legacy-compat"> is allowed in the HTML syntax.

The strict doctypes for HTML 4.0, HTML 4.01, XHTML 1.0 as well as XHTML 1.1 are also allowed (but are discouraged) in the HTML syntax.

In the XML syntax, any doctype declaration may be used, or it may be omitted altogether. Documents with an XML media type are always handled in standards mode.

2.3 MathML and SVG

The HTML syntax allows for MathML and SVG elements to be used inside a document. An math or svg start tag causes the HTML parser to switch to a special insertion mode which puts elements and attributes in the appropriate namespaces, does case fixups for elements and attributes that have mixed case, and supports the empty-element syntax as in XML. The syntax is still case-insensitive and attributes allow the same syntax as for HTML elements. Namespace declarations may be omitted. CDATA sections are supported in this insertion mode.

Some MathML and SVG elements cause the parser to switch back to "HTML mode", e.g. mtext and foreignObject, so you can use HTML elements or a new math or svg element.

For instance, a very simple document using some of the minimal syntax features could look like:

<!doctype html>
<title>SVG in text/html</title>
<p>
 A green circle:
 <svg> <circle r="50" cx="50" cy="50" fill="green"/> </svg>
</p>

2.4 Miscellaneous

There are a few other changes in the HTML syntax worthy of mentioning:

  • The &lang; and &rang; named character references now expand to U+27E8 and U+27E9 (mathematical left/right angle bracket) instead of U+2329 and U+232A (left/right-pointing angle bracket), respectively.

  • Many new named character references have been added, including all named character references from MathML.

  • Void elements (known as "EMPTY" in HTML4) are allowed to have a trailing slash.

  • The ampersand (&) may be left unescaped in more cases compared to HTML4.

  • Attributes have to be separated by at least one whitespace character.

  • Attributes with an empty value may be written as just the attribute name omitting the equals sign and the value, even if the attribute is not a boolean attribute. (It is commonly believed that HTML4 allowed the value to be omitted for boolean attributes. Instead, HTML4 allowed using only the attribute value and omitting the attribute name, for enumerated attributes, but this was not supported in browsers.)

  • Attributes omitting quotes for the value are allowed to use a larger set of characters compared to HTML4.

  • The HTML parser does not do any normalization of whitespace in attribute values; for instance, leading and trailing whitespace in the id attribute is not ignored (and thus now invalid), and newline characters can be used in the value attribute of the input element without using character references.

  • The optgroup end tag is now optional.

  • The colgroup start tag is now optional and is inferred by the HTML parser.

3 Language

This section is split up in several subsections to more clearly illustrate the various differences from HTML4.

3.1 New Elements

The following elements have been introduced for better structure:

  • section represents a generic document or application section. It can be used together with the h1, h2, h3, h4, h5, and h6 elements to indicate the document structure.

  • article represents an independent piece of content of a document, such as a blog entry or newspaper article.

  • main can be used as a container for the dominant contents of another element, such as the main content of the page.

  • aside represents a piece of content that is only slightly related to the rest of the page.

  • hgroup represents the header of a section.

  • header represents a group of introductory or navigational aids.

  • footer represents a footer for a section and can contain information about the author, copyright information, etc.

  • nav represents a section of the document intended for navigation.

  • figure represents a piece of self-contained flow content, typically referenced as a single unit from the main flow of the document.

    <figure>
 <video src="example.webm" controls></video>
 <figcaption>Example</figcaption>
</figure>

    figcaption can be used as caption (it is optional).

  • template can be used to declare fragments of HTML that can be cloned and inserted in the document by script.

Then there are several other new elements:

  • video and audio for multimedia content. Both provide an API so application Web developers can script their own user interface, but there is also a way to trigger a user interface provided by the user agent. source elements are used together with these elements if there are multiple streams available of different types.

  • track provides text tracks for the video element.

  • embed is used for plugin content.

  • mark represents a run of text in one document marked or highlighted for reference purposes, due to its relevance in another context.

  • progress represents a completion of a task, such as downloading or when performing a series of expensive operations.

  • meter represents a measurement, such as disk usage.

  • time represents a date and/or time.

  • data allows content to be annotated with a machine-readable value.

  • dialog for showing a dialog.

  • ruby, rt, and rp allow for marking up ruby annotations.

  • bdi represents a span of text that is to be isolated from its surroundings for the purposes of bidirectional text formatting.

  • wbr represents a line break opportunity.

  • canvas is used for rendering dynamic bitmap graphics on the fly, such as graphs or games.

  • menuitem represents a command the user can invoke from a popup menu.

  • details represents additional information or controls which the user can obtain on demand. The summary element provides its summary, legend, or caption.

  • datalist together with the a new list attribute for input can be used to make comboboxes:

    <input list="browsers">
<datalist id="browsers">
 <option value="Safari">
 <option value="Internet Explorer">
 <option value="Opera">
 <option value="Firefox">
</datalist>

  • keygen represents control for key pair generation.

  • output represents some type of output, such as from a calculation done through scripting.

The input element's type attribute now has the following new values:

The idea of these new types is that the user agent can provide the user interface, such as a calendar date picker or integration with the user's address book, and submit a defined format to the server. It gives the user a better experience as his input is checked before sending it to the server meaning there is less time to wait for feedback.

3.2 New Attributes

Several attributes have been introduced to various elements that were already part of HTML4:

  • The a and area elements have the new download and ping attributes.

  • The area element, for consistency with the a and link elements, now also has the hreflang, type and rel attributes.

  • The base element can now have a target attribute as well, mainly for consistency with the a element. (This is already widely supported.)

  • The meta element has a charset attribute now as this was already widely supported and provides a nice way to specify the character encoding for the document.

  • The table element now has a sortable attribute and the th element has a sorted attribute, which provide a means to sort table columns.

  • A new autofocus attribute can be specified on the input (except when the type attribute is hidden), select, textarea and button elements. It provides a declarative way to focus a form control during page load. Using this feature should enhance the user experience compared to focusing the element with script as the user can turn it off if the user does not like it, for instance.

  • A new placeholder attribute can be specified on the input and textarea elements. It represents a hint intended to aid the user with data entry.

    <input type=search name=q placeholder="Enter search phrase..."> <button>Search</button>
    <label>Email <input type=email name=email placeholder="john@example.com"></label>

    The placeholder attribute should not be used as a replacement for the label element. 

    <!-- Do not do this: -->
<input type=email name=email placeholder="Email">

  • The new form attribute for input, output, select, textarea, button, label, object and fieldset elements allows for controls to be associated with a form. These elements can now be placed anywhere on a page, not just as descendants of the form element, and still be associated with a form.

    <table>
 <tr>
  <th>Key
  <th>Value
  <th>Action
 <tr>
  <td><form id=1><input name=1-key></form>
  <td><input form=1 name=1-value>
  <td><button form=1 name=1-action value=save>✓</button>
      <button form=1 name=1-action value=delete>✗</button>
 ...
</table>

  • The new required attribute applies to input (except when the type attribute is hidden, image or some button type such as submit), select and textarea. It indicates that the user has to fill in a value in order to submit the form. For select, the first option element has to be a placeholder with an empty value. 

    <label>Color: <select name=color required>
 <option value="">Choose one
 <option>Red
 <option>Green
 <option>Blue
</select></label>

  • The fieldset element now allows the disabled attribute which disables all descendant controls (excluding those that are descendants of the legend element) when specified, and the name attribute which can be used for script access.

  • The input element has several new attributes to specify constraints: autocomplete, min, max, multiple, pattern and step. As mentioned before it also has a new list attribute which can be used together with the datalist element. It also now has the width and height attributes to specify the dimensions of the image when using type=image.

  • The input and textarea elements have a new attribute named dirname that causes the directionality of the control as set by the user to be submitted as well.

  • The textarea element also has three new attributes, maxlength, minlength and wrap which control max input length and submitted line wrapping behavior, respectively.

  • The form element has a novalidate attribute that can be used to disable form validation submission (i.e. the form can always be submitted).

  • The input and button elements have formaction, formenctype, formmethod, formnovalidate, and formtarget as new attributes. If present, they override the action, enctype, method, novalidate, and target attributes on the form element.

  • The input element also has the new minlength attribute.

  • The input and textarea elements have an inputmode attribute.

  • The menu element has two new attributes: type and label. They allow the element to transform into a menu as found in typical user interfaces as well as providing for context menus in conjunction with the global contextmenu attribute.

  • The button element has a new menu attribute, used together with popup menus.

  • The style element has a new scoped attribute which can be used to enable scoped style sheets. Style rules within such a style element only apply to the local tree.

  • The script element has a new attribute called async that influences script loading and execution.

  • The html element has a new attribute called manifest that points to an application cache manifest used in conjunction with the API for offline Web applications.

  • The link element has a new attribute called sizes. It can be used in conjunction with the icon relationship (set through the rel attribute; can be used for e.g. favicons) to indicate the size of the referenced icon, thus allowing for icons of distinct dimensions.

  • The ol element has a new attribute called reversed. When present, it indicates that the list order is descending.

  • The iframe element has new attributes called sandbox, seamless, and srcdoc which allow for sandboxing content, e.g. blog comments.

  • The object element has a new attribute called typemustmatch which allows safer embedding of external resources.

  • The img element has a new attribute called crossorigin to use CORS in the fetch and if it is successful, allows the image data to be read with the canvas API. The script element has a crossorigin attribute to allow script errors to be reported to onerror with information about the error. The link element also has a crossorigin attribute.

  • The img element has new attributes called srcset and sizes, along with the new elements picture and source to allow Web developers to declaratively control or give hints to the user agent about which image resource to use, based on the screen pixel density, viewport size, image format, and other factors.

Several attributes from HTML4 now apply to all elements. These are called global attributes: accesskey, class, dir, id, lang, style, tabindex and title. Additionally, XHTML 1.0 only allowed xml:space on some elements, which is now allowed on all elements in XHTML documents.

There are also several new global attributes:

  • The contenteditable attribute indicates that the element is an editable area. The user can change the contents of the element and manipulate the markup.

  • The contextmenu attribute can be used to point to a context menu provided by the Web developer.

  • The data-* collection of Web developer-defined attributes. Web developers can define any attribute they want as long as they prefix it with data- to avoid clashes with future versions of HTML. These are intended to be used to store custom data to be consumed by the Web page or application itself. They are not intended for data to be consumed by other parties (e.g. user agents).

  • The draggable and dropzone attributes can be used together with the new drag & drop API.

  • The hidden attribute indicates that an element is not yet, or is no longer, relevant.

  • The role and aria-* collection attributes which can be used to instruct assistive technology.

  • The spellcheck attribute allows for hinting whether content can be checked for spelling or not.

  • The translate attribute gives a hint to translators whether the content should be translated.

HTML also makes all event handler attributes from HTML4, which take the form onevent, global attributes and adds several new event handler attributes for new events it defines; for instance, the onplay event handler attribute for the play event which is used by the API for the media elements (video and audio). The specification has an index of all events.

3.3 Changed Elements

These elements have slightly modified meanings in HTML to better reflect how they are used on the Web or to make them more useful:

  • The b element now represents a span of text to which attention is being drawn for utilitarian purposes without conveying any extra importance and with no implication of an alternate voice or mood, such as key words in a document abstract, product names in a review, actionable words in interactive text-driven software, or an article lede.

  • The cite element now solely represents the title of a work (e.g. a book, a paper, an essay, a poem, a score, a song, a script, a film, a TV show, a game, a sculpture, a painting, a theatre production, a play, an opera, a musical, an exhibition, a legal case report, etc). Specifically the example in HTML4 where it is used to mark up the name of a person is no longer considered conforming.

  • The dl element now represents an association list of name-value groups, and is no longer said to be appropriate for dialogue.

  • The hr element now represents a paragraph-level thematic break.

  • The i element now represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose in a manner indicating a different quality of text, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, a thought, or a ship name in Western texts.

  • For the label element the browser should no longer move focus from the label to the control unless such behavior is standard for the underlying platform user interface.

  • The menu element is redefined to be useful for toolbars and popup menus.

  • The noscript element is no longer said to be rendered when the user agent doesn't support a scripting language invoked by a script element earlier in the document.

  • The s element now represents contents that are no longer accurate or no longer relevant.

  • The script element can now be used for scripts or for custom data blocks.

  • The small element now represents side comments such as small print.

  • The strong element now represents importance rather than strong emphasis.

  • The u element now represents a span of text with an unarticulated, though explicitly rendered, non-textual annotation, such as labeling the text as being a proper name in Chinese text (a Chinese proper name mark), or labeling the text as being misspelt.

3.4 Changed Attributes

Several attributes have changed in various ways.

  • The alt attribute on img has more elaborate requirements, and in some cases can also be omitted. For details, see the specification.

  • The accept attribute on input now allows the values audio/*, video/* and image/*.

  • The accesskey global attribute now allows multiple characters to be specified, which the user agent can choose from.

  • The action attribute on form is no longer allowed to have an empty URL.

  • The method attribute has a new keyword dialog, intended to close a dialog element.

  • The colspan attribute on td and th now has to be greater than zero.

  • The coords attribute on area no longer allows a percentage value of the radius when the element is in the circle state.

  • The data attribute on object is no longer said to be relative to the codebase attribute.

  • The defer attribute on script now explicitly makes the script execute when the page has finished parsing.

  • The dir global attribute now allows the value auto.

  • The enctype attribute on form now supports the value text/plain.

  • The width and height attributes on img, iframe and object are no longer allowed to contain percentages. They are also not allowed to be used to stretch the image to a different aspect ratio than its intrinsic aspect ratio.

  • The href attribute on link is no longer allowed to have an empty URL.

  • The href attribute on base is now allowed to contain a relative URL.

  • All attributes that take URLs, e.g. href on the a element, now support IRIs if the document's encoding is UTF-8 or UTF-16.

  • The http-equiv attribute on meta is no longer said to be used by HTTP servers to create HTTP headers in the HTTP response. Instead, it is said to be a pragma directive to be used by the user agent.

  • The id global attribute is now allowed to have any value, as long as it is unique, is not the empty string, and does not contain space characters.

  • The lang global attribute takes the empty string in addition to a valid language identifier, just like xml:lang does in XML.

  • The media attribute on link now accepts a media query list and defaults to "all".

  • The event handler attributes (e.g. onclick) now always use JavaScript as the scripting language.

  • The value attribute of the li element is no longer deprecated as it is not presentational. The same goes for the start and type attributes of the ol element.

  • The style global attribute now always uses CSS as the styling language.

  • The tabindex global attribute now allows negative values which indicate that the element can receive focus but cannot be tabbed to.

  • The target attribute of the a and area elements is no longer deprecated, as it is useful in Web applications, e.g. in conjunction with iframe.

  • The type attribute on script and style is no longer required if the scripting language is JavaScript and the styling language is CSS, respectively.

  • The usemap attribute on img no longer takes a URL, but instead takes a valid hash-name reference to a map element.

3.5 Obsolete Elements

The elements in this section are not to be used by Web developers. User agents will still have to support them and various sections in HTML define how. E.g. the obsolete isindex element is handled by the parser section.

The following elements are not in HTML because their effect is purely presentational and their function is better handled by CSS:

The following elements are not in HTML because using them damages usability and accessibility:

The following elements are not included because they have not been used often, created confusion, or their function can be handled by other elements:

  • acronym is not included because it has created a lot of confusion. Web developers are to use abbr for abbreviations.

  • applet has been obsoleted in favor of object.

  • isindex usage can be replaced by usage of form controls.

  • dir has been obsoleted in favor of ul.

Finally the noscript element is only conforming in the HTML syntax. It is not allowed in the XML syntax. This is because in order to not only hide visually but also prevent the content to run scripts, apply style sheets, have submittable form controls, load resources, and so forth, the HTML parser parses the content of the noscript element as plain text. The same is not possible with an XML parser.

3.6 Obsolete Attributes

Some attributes from HTML4 are no longer allowed in HTML. The specification defines how user agents should process them in legacy documents, but Web developers are not allowed use them and they will not validate.

HTML has advice on what you can use instead.

In addition, HTML has none of the presentational attributes that were in HTML4 as their functions are better handled by CSS:

The following attributes are allowed but Web developers are discouraged from using them and instead strongly encouraged to use an alternative solution:

  • The border attribute on img. It is required to have the value "0" when present. Web developers can use CSS instead.

  • The language attribute on script. It is required to have the value "JavaScript" (case-insensitive) when present and cannot conflict with the type attribute. Web developers can simply omit it as it has no useful function.

  • The name attribute on a. Web developers can use the id attribute instead.

4 Content Model

The content model is what defines how elements may be nested — what is allowed as children (or descendants) of a certain element.

At a high level, HTML4 had two major categories of elements, "inline" (e.g. span, img, text), and "block-level" (e.g. div, hr, table). Some elements did not fit in either category.

Some elements allowed "inline" elements (e.g. p), some allowed "block-level" elements (e.g. body), some allowed both (e.g. div), while other elements did not allow either category but only allowed other specific elements (e.g. dl, table), or did not allow any children at all (e.g. link, img, hr).

Notice the difference between an element itself being in a certain category, and having a content model of a certain category; for instance, the p element is itself a "block-level" element, but has a content model of "inline".

To make it more confusing, HTML4 had different content model rules in its Strict, Transitional and Frameset flavors; for instance, in Strict, the body element allowed only "block-level" elements, but in Transitional, it allowed both "inline" and "block-level".

To make things more confusing still, CSS uses the terms "block-level element" and "inline-level element" for its visual formatting model, which is related to CSS's 'display' property and has nothing to do with HTML's content model rules.

HTML does not use the terms "block-level" or "inline" as part of its content model rules, to reduce confusion with CSS. However, it has more categories than HTML4, and an element can be part of none of them, one of them, or several of them.

  • Metadata content, e.g. link, script.

  • Flow content, e.g. span, div, text. This is roughly like HTML4's "block-level" and "inline" together.

  • Sectioning content, e.g. aside, section.

  • Heading content, e.g. h1.

  • Phrasing content, e.g. span, img, text. This is roughly like HTML4's "inline". Elements that are phrasing content are also flow content.

  • Embedded content, e.g. img, iframe, svg.

  • Interactive content, e.g. a, button, label. Interactive content is not allowed to be nested.

As a broad change from HTML4, HTML no longer has any element that only accepts what HTML4 called "block-level" elements; e.g. the body element now allows flow content. Thus, This is closer to HTML4 Transitional than HTML4 Strict.

Further changes include:

  • The address element now allows flow content, but with no heading content descendants, no sectioning content descendants, and no header, footer, or address element descendants.

  • HTML4 allowed object in head. HTML does not.

  • The link and meta elements are allowed as descendants of body if they use microdata attributes.

  • The noscript element was a "block-level" element in HTML4, but is phrasing content in HTML.

  • The table, thead, tbody, tfoot, tr, ol, ul and dl elements are allowed to be empty in HTML.

  • Table elements have to conform to the table model (e.g. two cells are not allowed to overlap).

  • The table element now does not allow col elements as direct children. However, the HTML parser implies a colgroup element, so this change should not affect text/html content.

  • The table element now allows the tfoot element to be the last child.

  • The caption element now allows flow content, but with no descendant table elements.

  • The th element now allows flow content, but with no header, footer, sectioning content, or heading content descendants.

  • The a element now has a transparent content model (except it does not allow interactive content descendants), meaning that it has the same content model as its parent. This means that the a element can now contain e.g. div elements, if its parent allows flow content.

  • The ins and del elements also have a transparent content model. HTML4 had similar rules in prose that could not be expressed in the DTD.

  • The object element also has a transparent content model, after its param children.

  • The map element also has a transparent content model. The area element is considered phrasing content if there is a map element ancestor, which means that they do not need to be direct children of map.

  • The fieldset element no longer requires a legend child.

5 APIs

HTML has introduced many new APIs and has extended, changed or obsoleted some existing APIs.

5.1 New APIs

HTML introduces a number of APIs that help in creating Web applications. These can be used together with the new elements introduced for applications:

5.2 Changed APIs

The following features from DOM Level 2 HTML are changed in various ways:

5.3 Extensions to Document

DOM Level 2 HTML had an HTMLDocument interface that inherited from Document and provided HTML-specific members on documents. HTML has moved these members to the Document interface, and extended it in a number of ways. Since all documents use the Document interface, the HTML-specific members are now available on all documents, so they are usable in e.g. SVG documents as well. It also has several new members:

Existing scripts that modified the prototype of HTMLDocument should continue to work because window.HTMLDocument now returns the Document interface object.

5.4 Extensions to HTMLElement

The HTMLElement interface has also gained several extensions in HTML:

Some members were previously defined on HTMLElement but been moved to the Element interface in the DOM standard: [DOM]

  • id reflects the id content attribute.

  • className reflects the class content attribute.

  • classList is a convenient accessor for className. The object it returns exposes methods (contains(), add(), remove(), and toggle()) for manipulating the element's classes.

  • getElementsByClassName() returns a list of elements with the specified classes.

5.5 Extensions to Other Interfaces

Some interfaces in DOM Level 2 HTML have been extended.

In addition, most new content attributes also have corresponding IDL attributes on the elements' interfaces, e.g. the sizes IDL attribute on HTMLLinkElement which reflects the sizes content attribute.

5.6 Obsolete APIs

Some APIs are now either removed altogether, or marked as obsolete.

All IDL attributes that reflect a content attribute that is itself obsolete, are now also obsolete; for instance, the bgColor IDL attribute on HTMLBodyElement which reflects the obsolete bgcolor content attribute is now obsolete.

The following interfaces are marked obsolete since the elements are obsolete: HTMLAppletElement, HTMLFrameSetElement, HTMLFrameElement, HTMLDirectoryElement and HTMLFontElement.

The HTMLIsIndexElement interface is removed altogether since the HTML parser expands an isindex tag into other elements. The HTMLBaseFontElement interface is also removed since the element has no effect.

The following members of the HTMLDocument interface (which have now moved to Document) are now obsolete: anchors and applets.

Acknowledgments

The editors would like to thank Ben Millard, Bruce Lawson, Cameron McCormack, Charles McCathieNevile, Dan Connolly, David Håsäther, Dennis German, Frank Ellermann, Frank Palinkas, 羽田野太巳 (Futomi Hatano), Gordon P. Hemsley, Henri Sivonen, Jacob Palme, James Graham, Jens Oliver Meiert, Jeremy Keith, Jukka K. Korpela, Jürgen Jeka, Krijn Hoetmer, Leif Halvard Silli, Maciej Stachowiak, Mallory van Achterberg, Marcos Caceres, Mark Pilgrim, Martijn Wargers, Martin Leese, Martyn Haigh, Masataka Yakura, Michael Smith, Mike Taylor, Ms2ger, Olivier Gendrin, Øistein E. Andersen, Philip Jägenstedt, Philip Taylor, Randy Peterman, Robin Berjon, Steve Faulkner, Timo Tijhof, Toby Inkster, Xaxio Brandish, Yngve Spjeld Landro and Zhong Yu for their contributions to this document as well as to all the people who have contributed to HTML over the years for improving the Web!

References

[CSSOM]
CSS Object Model (CSSOM), Simon Pieters and Glenn Adams. W3C.
[DOCTYPE]
Activating Browser Modes with Doctype, Henri Sivonen.
[DOM]
DOM, Anne van Kesteren, Aryeh Gregor and Ms2ger. WHATWG.
[DOM2HTML]
Document Object Model (DOM) Level 2 HTML Specification, Johnny Stenback, Philippe Le Hégaret and Arnaud Le Hors. W3C.
[HTML]
HTML, Ian Hickson. WHATWG.
[HTML4]
HTML 4.01 Specification, Dave Raggett, Arnaud Le Hors and Ian Jacobs. W3C.
[HTML5]
HTML5, Robin Berjon, Steve Faulkner, Travis Leithead et al.. W3C.
[HTML5NIGHTLY]
HTML 5.1 Nightly, Robin Berjon, Steve Faulkner, Travis Leithead et al.. W3C.
[XHTML1]
XHTML™ 1.1 - Module-based XHTML - Second Edition, Murray Altheim and Shane McCarron.
[XML]
Extensible Markup Language, Tim Bray, Jean Paoli, C. M. Sperberg-McQueen et al.. W3C.
[XMLNS]
Namespaces in XML, Tim Bray, Dave Hollander, Andrew Layman et al.. W3C.

chenyulancn
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
html4 与html 5 的区别
10-14
html4 与html5 的区别，html5 快速人们，html4 与html5 的比较
html4和html5的区别
qq_43205326的博客
12-12 2948
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结 前言 提示：这里可以添加本文要记录的大概内容： 例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。 提示：以下是本篇文章正文内容，下面案例可供参考 一、pandas是什么？ 示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。 二、使用步骤 1.引入库 代码
HTML和HTML5的区别？
zw_wen的博客
08-26 1024
html文件 =文档声明 +html标签部分 组成；html标签部分 =头部<head> +内容区域<body> 1.文档声明的类型不同； doctype 声明是不区分大小写的，用来告知 Web 浏览器页面使用了哪种 HTML 版本； 在HTML 4.01 中，<!DOCTYPE> 声明需引用 DTD （文档类型声明），因为 HTML 4.01 是基于 SGML（Standard Generalized Markup Language 标准通用标记语言）...
html5和html有什么区别？这篇文章告诉你
OTS_luo的博客
03-19 9335
html5和html有什么区别？这篇文章告诉你HTML是什么？HTML版本html5和html的区别指代不同 很多伙伴在入门前端的时候会认识HTML和html5，那么HTML和html5是一个东西吗啊？有什么区别，下面小编带你了解HTML HTML是什么？ HTML称为超文本标记语言，是一种标识性的语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一...
前端面试题目合集
weixin_30770783的博客
02-06 1314
抱歉，这篇博客是很早写的，并且决定了不再更新，是因为github上有很多整理的很好的面试图谱 我列举下我看过的比较好的几个（按质量排序，最好的放前面） https://yuchengkai.cn/docs/zh/(这个是我见过最好的前端面试图谱了) https://github.com/yangshun/tech-interview-handbook https://githu...
HTML和HTML5的简单区别
weixin_45773503的博客
05-08 4794
html5
Web时代变迁及html5与html4的区别
12-13
接下来通过本文一起学习html5和html4的区别吧 HTML5的新结构标签 在之前的HTML页面中，大家基本上都是用了Div+CSS的布局方式。而搜索引擎去抓取页面的内容的时候，它只能猜测 你的某个Div内的内容是文章内容容器，...
HTML5与HTML4的区别中文WORD版
07-22
资源名称：HTML5与HTML4的区别 中文WORD版本文档主要讲述的是HTML5与HTML4的区别；有需要的朋友可以下载看看 资源太大，传百度网盘了，链接在附件中，有需要的同学自取。
HTML5和以前HTML4的区别整理
12-14
最新最全的HTML5-HTML4对比信息请看http://dev.w3.org/html5/html4-differences/，貌似略多的样子。在这个IE还仍然存在的世界里，HTML5的差别先掌握一些即可，等全部支持后再细细研究也不迟。 1. 简化的语法HTML5...
解决java.lang.IllegalStateException: The content of the adapter has changed but ListView...的问题
热门推荐
ueryueryuery的专栏
03-06 4万+
我写了一个Dialog，Dialog中有一个ListView，想要点ListView中的一项后，跳转到另外一个Activity去。 但在使用时，会偶尔报出下面的错误： 02-21 14:54:28.928: E/AndroidRuntime(2846): FATAL EXCEPTION: main 02-21 14:54:28.928: E/AndroidRuntime(2846
html与HTML5的区别
X W F
02-27 635
html与HTML5的区别 文章目录html与HTML5的区别文档的类型声明不同语义结构方面 文档的类型声明不同 html5:文档声明相对来说更为简便，有利于程序员快速阅读和开发。 语义结构方面 html:没有结构语义化的标签（通俗来讲就是不方便阅读，没有告诉你哪里是头，哪里是尾巴） html5:添加了许多具有语义化的标签， 使代码结构清晰，提高了代码的可读性。 下面是html5中的一些语义化标签...
HTML和HTML5的区别
qq_43067585的博客
05-19 276
下面本篇文章就来给大家介绍和对比一下HTML和HTML5，让大家了解HTML和HTML5之间的一些区别，希望对大家有所帮助。 什么是HTML和HTML5？ HTML代表超文本标记语言，用于使用标记语言设计网页。HTML是超文本和标记语言的组合，超文本定义了网页之间的链接；标记语言用于定义标记内的文本文档，该文档定义网页的结构。此语言用于注释（在计算机注释中）文本，以便机器可以理解它并相应地操作文本。 大多数标记（例如HTML）语言都是人类可读的。该语言使用标签来定义必须对文本进行哪些操作。它用于在网页上构
html5和html的区别是什么（精问）
weixin_34269583的博客
06-07 342
html5和html的区别是什么（精问） 一、总结 一句话总结：html5：简洁（文档生命，链接引入） 语义化（语义化标签）  API（canvas，地理位置等）  一些标签（input新类型）    二、html5和html的区别是什么 可能有人会问，这两者有什么关系呢？随着这移动互联网快速发展的时代，尤其是4G时代已经来临的时刻，加上微软对“XP系统”不提供更新补丁、维护的情况下。“...
HTML与HTML5有什么区别？HTML5有什么新特点？
HPK8_CPH的博客
12-24 881
HTML5是最新的HTML标准，或迟或早，所有的web程序员都会发现需要使用到这个最新的标准，而且，很多人都会感觉到，重新开发一个HTML5的网站，要比把一个网站从HTML4迁移到HTML5上容易的多，这是因为这两个版本之间有很大不同之处。     事实上，HTML5并没有对HTML4做什么重大的修改，它们很多东西都是相似的。     可是，其中有一些很重要的区别你需要知道。下面列出的
前端学习之html(1)--html与html5的区别
xdblv的博客
02-24 357
html是什么? Html 代表超文本标记语言,用于使用标记语言设计网页.HTML是超文本和标记语言的组合，超文本定义了网页之间的链接；标记语言用于定义标记内的文本文档，该文档定义网页的结构。此语言用于注释（在计算机注释中）文本，以便机器可以理解它并相应地操作文本。 HTML5 是HTML的第五个版本，HTML5中删除或修改了许多元素。 HTML5和HTML的区别 首先，HTML5已经远远超越了标记语言的范畴，它的设计目的是在移动设备上支持多媒体，和HTML比起来，深度和广度上都做了进一步提升。 1、文档声
HTML5 Differences from HTML4
weixin_30522095的博客
12-17 309
Abstract "HTML5 Differences from HTML4" describes the differences of the HTML5 specification from those of HTML4. Status of This Document This section describes the status of this document a...
HTML5和HTML的区别
Bernard Han的博客
01-24 1551
很多没有学过HTML5大前端的同学，对HTML5并不了解，经常会提出疑问：HTML5与传统HTML有什么区别？下面本篇文章就来给大家介绍一下HTML5和HTML两者之间的区别，希望对你有所帮助。 什么是HTML和HTML5？ HTML代表超文本标记语言，用于使用标记语言设计网页。HTML是超文本和标记语言的组合，超文本定义了网页之间的链接；标记语言用于定义标记内的文本文档，该文档定义网页的结构。此语言用于注释（在计算机注释中）文本，以便机器可以理解它并相应地操作文本。 大多数标记（例如HTML）语言都
HTML5与HTML之间有什么区别?
黑马程序员官方博客
05-03 271
CSS 是层叠样式表 ( Cascading Style Sheets ) 的简称，有时我们也会称之为 CSS 样式表或级联样式表。CSS 是也是一种标记语言。CSS 主要用于设置 HTML 页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局和外观显示样式。CSS 让我们的网页更加丰富多彩，布局更加灵活自如。简单理解：CSS 可以美化 HTML , 让 HTML 更漂亮， 让页面布局更简单。
浅谈html与HTML5的三大区别
yezi__6的博客
09-28 1万+
        今天有人问我了，你经常用html5还是html？emmm......其实自己在平时写网页时，对这两者没有特意区分。如果非要说区别的话，显而易见的区别就是下面我列出来的这些了。至于往深层次理解了：HTML5已经远远超越了标记语言的范畴，其背后是一组技术集。小白学习太浅，不敢多讲。&gt;.&lt; 1.文档的类型声明不同 html:&lt;!DOCTYPE HTML PUBLIC...
sass与vue与html5的区别
最新发布
06-11
HTML5使用的是标记语言，它的语法和规则与XML相同。 4. 功能不同 Sass主要是为了增强CSS的功能，提高CSS的可维护性和可重用性；Vue主要是为了构建Web应用程序，提供了组件化、状态管理、路由等功能；HTML5主要是...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值