Web前端面试题第四道—Html5与html4的异同

HTML5新特性

HTML5 中一些有趣的新特性：

①用于绘画的 canvas 元素；

②用于媒介回放的 video 和 audio 元素；

③对本地离线存储的更好的支持；

④新的特殊内容元素，比如 article、footer、header、nav、section；

⑤新的表单控件，比如 calendar、date、time、email、url、search"

以上是w3c上的原话，简单说就是更符合标准，提供更多功能支持；更加规范，可读性更强，性能有提升，实现功能更加简单方便，就像手机一样，高版本的功能多一些。

现在越来越多的程序员开始HTML5来构建网站。虽然HTML5与HTML4有很多相似之处，也有一些关键的不同。如果想在你的工作中使用这些新的标记和属性，建议你最好只是做实验，原因是HTML5仍在制定中，这些新标记和新属性在将来也许会有很大的改变，所以你要不断的更新代码，它们很可能会过期失效。所以最好耐心的等到HTML5真正可以实用时候再应用到工作中来。

下边列出了HTML5余HTML4之间10个关键的不同之处

1、HTML5仍然是一个制定中的标准

这第一个也是非常重要的一个区别，虽然与HTML4相比HTML5很酷，很规范，但是这些都无法改变HTML5依然是一个制定中的标准的事实。HTML5仍然处在初级阶段，预期会发生很多变化。你必须把这些因素考虑进来，因为这个你需要不停的更新升级你的网站，这是很不方便的。这也是为什么到目前为止，最好在产品里使用HTML4，只在实验里使用HTML5的原因。HTML4也许已经超过10岁了，但是它作为正式标准的事实一直没变。

2、简化的语法

更简单的doctype声明是HTML5里众多新特征之一。现在只需要写就好了。HTML5的语法兼容HTML4和XHTML1，但不兼容SGML。

3、新的标记代替flash

Flash给Web开发者带来了很多麻烦，因为想要在网页上播放Flash需要一堆代码和插件。标签使得开发者只要使用一个标签就能和用户产生UI交互。虽然目前标签还不能实现Flash的所有功能，但是相信很快就会颠覆并代替flash。

4、新的

与

标记

HTML5的设计是要更好的描绘网站的解剖结构。这就是为什么一些像

和

这样的新标记会出现，它们是专门为标志网站的这些部分设计的。用来明确表示网页的结构。

5、新的

与

与标记

跟

与

标记相似，HTML5中引入的新的

和

标记可以让开发人员更好的标注页面上的这些区域。有利于清晰化网页的结构，更有利于SEO。

6. 新的

和

标记

新的< menu>可以被用于创建传统的菜单，也可以用于工具栏和上下文菜单。新的< figure>标签使得网页文字和图片的排版更专业。

7. 新的

新的

除此之外还增加了新的多媒体的标记和属性，例如，它是用来提供跟踪视频的文字信息的。

8. 表单的全新水平

新的

和 标记对原有的表单元素进行的全新的修改，添加了很多的新属性，也修改了很多属性。如果你经常的开发表单，建议花时间更详细的研究一下。

9. 不再使用 和 标记

官方说明是这些标记可以通过CCS来做更好的处理，也许我们以后会习惯这种方法。

10. 不再使用,

, 标记

有了更好的标记能实现他们的功能。

这10个HTML5和HTML4之间的不同只是整个新的规范中的一小部分。除了这些主要的变动外，我还可以略提一下一些次要的改动，比如修改了

标记的属性，让它能够倒排序，对标记也做了些修改。

那么如何处理HTML5新标签的浏览器兼容问题呢？








以上十点只是HTML5和HTML4差别的很小一部分，最新最全的HTML5-HTML4对比信息请看：http://dev.w3.org/html5/html4-differences/