前端面试必备之html5的新特性

2019-01-28 21:52:43丽君

消息事件是一个拥有data(数据)和origin(源)属性的DOM事件。data属性是发送方传递的实际消息,而origin属性是发送来源。

XMLHttpRequest Level2

XMLHttpRequest API使得Ajax技术成为可能,作为XMLHttpRequest的改进版,XMLHttpRequest Level2在功能上有了很大的改进。主要两个方面:

    跨源XMLHttpRequest 进度事件

跨源XMLHttpRequest

过去,XMLHttpRequest仅限于同源通信,XMLHttpRequest Level2通过CORS实现了跨源XMLHttpRequest。跨源HTTP请求包含一个Origin头部,它为服务器提供HTTP请求的源信息。

WebSockets API

WebSockets是html5中最强大的通信功能,它定义了一个全双工通信信道,仅通过Web上的一个Socket即可进行通信。

WebSockets握手

为了建立WebSockets通信,客户端和服务器在初始握手时,将HTTP协议升级到WebSocket协议。一旦连接建立成功,就可以在全双工模式下在客户端和服务器之间来回传递WebSocket消息。

WebSockets接口

除了对WebSockets协议定义外,该规范还同时定义了用于JavaScript应用程序的WebSocket接口。WebSockets接口的使用很简单。要连接远程主机,只需要新建一个WebSocket实例,提供希望连接的对端URL。

Forms API

新表单元素

    tel元素,表示电话号码。 email元素,表示电子邮件地址文本框。 url元素,表示网页的url。 search元素,用于搜索引擎,比如在站点顶部显示的搜索框。 range元素,特定值范围内的数值选择器,典型的显示方式是滑动条。 number元素,只包含数值的字段。

未来的表单元素

    color元素,颜色选择器,基于调色盘或者取色板进行选择。 datetime元素,显示完整的日期和时间,包括时区。 datetime-local,显示日期和时间。 time元素,不含时区的时间选择器和指示器。 date元素,日期选择器。 week元素,某年中的周选择器。 month元素,某年中的月选择器。

新的表单特性和函数

placeholder

当用户还没输入值的时候,输入型控件可以通过placeholder特性向用户显示描述性说明或者提示信息。

<input name="name" placeholder="First and last name">

autocomplete

浏览器通过autocomplete特性能够知晓是否应该保存输入值以备将来使用。

autofocus

通过autofocus特性可以指定某个表单元素获得输入焦点,每个页面上只允许出现一个autofocus特性,如果设置了多个,则相当于未指定此行为。

spellcheck

可对带有文本内容的输入控件和textarea空间控制spellcheck属性。设置完后,会询问浏览器是否应该给出拼写检查结果反馈。spellcheck属性需要赋值。

list特性和datalist元素