HTML 4 和 HTML 5 之间的主要区别是什么?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/134727/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-28 22:23:24  来源:igfitidea点击:

What's the key difference between HTML 4 and HTML 5?

htmlhtml4

提问by deepwell

What are the key differences between HTML4and HTML5 draft?

HTML4HTML5 草案之间的主要区别是什么?

Please keep the answers related to changed syntax and added/removed html elements.

请保留与更改的语法和添加/删除的 html 元素相关的答案。

回答by Xanthir

HTML5 has several goals which differentiate it from HTML4.

HTML5 有几个区别于 HTML4 的目标。

Consistency in Handling Malformed Documents

处理格式错误文件的一致性

The primary one is consistent, defined error handling. As you know, HTML purposely supports 'tag soup', or the ability to write malformed code and have it corrected into a valid document. The problem is that the rules for doing this aren't written down anywhere. When a new browser vendor wants to enter the market, they just have to test malformed documents in various browsers (especially IE) and reverse-engineer their error handling. If they don't, then many pages won't display correctly (estimates place roughly 90% of pages on the net as being at least somewhat malformed).

第一个是一致的、定义的错误处理。如您所知,HTML 特意支持“标签汤”,即编写格式错误的代码并将其更正为有效文档的能力。问题是执行此操作的规则没有写在任何地方。当一个新的浏览器供应商想要进入市场时,他们只需要在各种浏览器(尤其是 IE)中测试格式错误的文档并对其错误处理进行逆向工程。如果他们不这样做,那么许多页面将无法正确显示(估计网络上大约 90% 的页面至少有些格式不正确)。

So, HTML5 is attempting to discover and codify this error handling, so that browser developers can all standardize and greatly reduce the time and money required to display things consistently. As well, long in the future after HTML has died as a document format, historians may still want to read our documents, and having a completely defined parsing algorithm will greatly aid this.

因此,HTML5 正在尝试发现并编纂这种错误处理,以便浏览器开发人员都可以标准化并大大减少一致显示内容所需的时间和金钱。同样,在 HTML 作为一种文档格式消亡很久之后,历史学家可能仍然希望阅读我们的文档,而拥有一个完全定义的解析算法将对此大有帮助。

Better Web Application Features

更好的 Web 应用程序功能

The secondary goal of HTML5 is to develop the ability of the browser to be an application platform, via HTML, CSS, and Javascript. Many elements have been added directly to the language that are currently (in HTML4) Flash or JS-based hacks, such as <canvas>, <video>, and <audio>. Useful things such as Local Storage (a js-accessible browser-built-in key-value database, for storing information beyond what cookies can hold), new input types such as date for which the browser can expose easy user interface (so that we don't have to use our js-based calendar date-pickers), and browser-supported form validation will make developing web applications much simpler for the developers, and make them much faster for the users (since many things will be supported natively, rather than hacked in via javascript).

HTML5 的次要目标是通过 HTML、CSS 和 Javascript 开发浏览器成为应用程序平台的能力。许多元素直接添加到目前(在HTML4)闪存或基于JS-黑客,如语言<canvas><video><audio>。有用的东西,例如本地存储(一个 js 可访问的浏览器内置键值数据库,用于存储超出 cookie 所能容纳的信息),新的输入类型,例如浏览器可以公开简单用户界面的日期(以便我们不必使用我们基于 js 的日历日期选择器),并且浏览器支持的表单验证将使开发人员的 Web 应用程序开发变得更加简单,并使用户的开发速度更快(因为许多事情将得到本机支持,而不是通过 javascript 入侵)。

Improved Element Semantics

改进的元素语义

There are many other smaller efforts taking place in HTML5, such as better-defined semantic roles for existing elements (<strong>and <em>now actually mean something different, and even <b>and <i>have vague semantics that should work well when parsing legacy documents) and adding new elements with useful semantics - <article>, <section>, <header>, <aside>, and <nav>should replace the majority of <div>s used on a web page, making your pages a bit more semantic, but more importantly, easier to read. No more painful scanning to see just what that random </div>is closing - instead you'll have an obvious </header>, or </article>, making the structure of your document much more intuitive.

还有许多其他较小的努力发生在HTML5中,如现有元素定义更好的语义角色(<strong><em>现在实际上意味着不同的东西,甚至<b><i>具有解析传统文档时,应该工作以及模糊语义)和有用的添加新元素语义 - <article>, <section>, <header>, <aside>, 和<nav>应该替换<div>网页上使用的大部分s,使您的页面更具语义,但更重要的是,更易于阅读。无需再费力地扫描即可查看随机</div>关闭的内容 - 相反,您将拥有一个明显的</header>, 或</article>,使您的文档结构更加直观。

回答by Christian Davén

From Wikipedia:

来自维基百科

  • New parsing rules oriented towards flexible parsing and compatibility
  • New elements – section, video, progress, nav, meter, time, aside, canvas
  • New input attributes – dates and times, email, url
  • New attributes – ping, charset, async
  • Global attributes (that can be applied for every element) – id, tabindex, repeat
  • Deprecated elements dropped – center, font, strike
  • 面向灵活解析和兼容性的新解析规则
  • 新元素——部分、视频、进度、导航、仪表、时间、旁边、画布
  • 新的输入属性——日期和时间、电子邮件、网址
  • 新属性——ping、字符集、异步
  • 全局属性(可以应用于每个元素)——id、tabindex、repeat
  • 已弃用的元素 - 中心、字体、罢工

回答by Zach

You'll want to check HTML5 Differences from HTML4: W3C Working Group Note 9 December 2014for the complete differences. There are many new elements and element attributes. Some elements were removed and others have different semantic value than before.

您需要查看HTML5 与 HTML4 的差异:W3C 工作组 2014 年 12 月 9 日的说明以了解完整的差异。有许多新元素和元素属性。一些元素被删除了,而另一些元素则具有与以前不同的语义值。

There are also APIs defined, such as the use of canvas, to help build the next generation of web apps and make sure implementations are standardized.

还定义了 API,例如使用画布,以帮助构建下一代 Web 应用程序并确保实现标准化。

回答by Viktor Fonic

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

HTML5 引入了许多有助于创建 Web 应用程序的 API。这些可以与为应用程序引入的新元素一起使用:

  • An API for playing of video and audio which can be used with the new video and audio elements.
  • An API that enables offline Web applications.
  • An API that allows a Web application to register itself for certain protocols or media types.
  • An editing API in combination with a new global contenteditableattribute.
  • A drag & drop API in combination with a draggableattribute.
  • An API that exposes the history and allows pages to add to it to prevent breaking the back button.
  • 用于播放视频和音频的 API,可与新的视频和音频元素一起使用。
  • 一种启用离线 Web 应用程序的 API。
  • 允许 Web 应用程序为特定协议或媒体类型注册自己的 API。
  • 结合新的全局contenteditable属性的编辑 API 。
  • draggable属性相结合的拖放 API 。
  • 公开历史记录并允许向其中添加页面以防止破坏后退按钮的 API。

回答by Mathias Bynens

You might be interested in this list of HTML5 elements and attributes.

您可能对这个HTML5 元素和属性列表感兴趣。

Also, please note that it's "HTML 4", not "HTML4". Indeed, for HTML 5, both variants are used, but there is an important difference in meaning. HTML 5 refers to the name of the W3C specification, whereas "HTML5" is the document type of those HTML files with a text/htmlMIME type that follow this spec. The same goes for XHTML 5 vs. XHTML5.

另外,请注意它是“HTML 4”,而不是“HTML4”。事实上,对于 HTML 5,两种变体都被使用,但在含义上存在重要差异。HTML 5 指的是 W3C 规范的名称,而“HTML5”是具有text/html遵循此规范的MIME 类型的那些 HTML 文件的文档类型。XHTML 5 与 XHTML5 也是如此。

回答by Sajit

Now W3c provides an official difference on their site:

现在 W3c 在其网站上提供了官方差异:

http://www.w3.org/TR/html5-diff/

http://www.w3.org/TR/html5-diff/

回答by user2909753

In short it is much simple compared to html, the long doctype is removed and also center and font tag is removed. I also answered this difference in my blog : http://ravisinghblog.in/key-difference-between-html-and-html-5/

简而言之,与 html 相比,它要简单得多,删除了长文档类型,并删除了中心和字体标签。我也在我的博客中回答了这个差异:http: //ravisinghblog.in/key-difference-between-html-and-html-5/

回答by e-satis

HTML 5 invites you give add a lot of semantic value to your code. What's more, there are natives solution to embed multimedia content.

HTML 5 邀请您为代码添加大量语义价值。更重要的是,有本地人解决方案来嵌入多媒体内容。

The rest is important, but it's more technical sugar that will save you from doing the same stuff with a client programming language.

其余的很重要,但它是更多的技术糖,可以使您免于使用客户端编程语言做同样的事情。