html的新特性有哪些

• 新增选择器 document.querySelector、document.querySelectorAll

        document.querySelector()只返回第一个满足条件的标签

        document.querySelectorAll()返回所有满足条件的标签,会返回一个伪数组,伪数组和数组类似

可以遍历,有length属性,但一些数组的方法没有,例如:push,map,shift 

• 拖拽释放(Drag and drop) API

        用户可使用鼠标选择可拖拽（draggable）元素，将元素拖拽到可放置（droppable）元素，并释放鼠标按钮以放置这些元素。

具体可参考

• 媒体播放的 video 和 audio

       

        用于支持音频播放

• 本地存储 localStorage 和 sessionStorage

        localStorage 本地储存,可在电脑本地储存一些网页的数据,不删除就会一直存在

        sessionStorage 会话储存,也是储存一些对应网页的数据,浏览器不关闭就不会删除,浏览器关闭后,数据将会被删除

• 离线应用 manifest

        在标签中添加这个属性,可以在打开页面后缓存这个页面,这样在无网络的情况下也可以访问该页面,有网络时可以更快的加载页面,还可以减少服务器的加载,浏览器只从服务器上下载已更新的/已更改的资源

• 桌面通知 Notifications

         Notifications api允许网页或应用程序在系统级别发送在页面外部显示的通知,就是我们可以在系统通知处看到页面发送的消息

例如:

         这个的使用有两点需要注意,一是要申请浏览器这里允许发送通知的权限,二是要打开系统通知,我就是搞了半天没反应,才想起来系统通知被我关了

• 语意化标签 article、footer、header、nav、section

        作用和div差不多,主要是当容器.相对于div有优势,具体去看html语义化标签的优势

• 增强表单控件 date、time、email、url、search、number等等

        date: 年-月-日格式的控件

        time: 时:分 格式的控件

        email: 提交表单时检测值是否是一个电子邮件格式

    url: 提交表单时检测值是否是一个url格式

        search: 用于搜索

        number: 数字输入框

• 新增表单元素

        datalist: 包含了一组">元素，这些元素表示其它表单控件可选值。

就是input框可以给我们提供一些参考值

        output: 用于不同类型的输出，比如计算或脚本输出

• 新增表单属性

        placeholder: 默认提示内容,在用户输入内容后消失

        required: boolean属性,确定是否必填

        autofocus: boolean属性,当页面加载时,可自动获取焦点

• 地理位置 Geolocation

        获取用户的地理位置

• 多任务 web worker

        当在 HTML 页面中执行脚本时，页面的状态是不可响应的，直到脚本已完成。

假设用户点击一个按钮，触发了一段用于计算的Javascript代码，那么在这段代码执行完毕之前，页面是无法响应用户 *** 作的。

        web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。

• 全双工通信协议 websocket

        双全工通信:允许数据同时在两个方向上传输

        现在我们获取服务器数据都是通过ajax发送http请求,如果需要不停的获取新数据,就要不停的发送http请求,然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然这样会浪费很多的带宽等资源。

        在 WebSocket API 中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。

两者之间就直接可以数据互相传送。

• 历史管理 history

        允许 *** 作浏览器的曾经在标签页或者框架里访问的会话历史记录。

        功能相当于浏览器左上角前进后退功能

• 跨域资源共享(CORS) Access-Control-Allow-Origin

        出于安全考虑，跨域的资源是无法获取的

        跨域:协议，域名，端口至少有一个不一致就是跨域了

        Access-Control-Allow-Origin是HTML5中定义的一种解决资源跨域的策略。

他是通过服务器端返回带有Access-Control-Allow-Origin标识的Response header(响应头)，用来解决资源的跨域权限问题。

Access-Control-Allow-Origin: *

        表示所有人都可以访问

        如果资源是html页面，可以设置 

• 页面可见性改变事件 visibilitychange

        字面意思,当元素显示或隐藏时触发的事件

• 跨窗口通信 PostMessage

        实现不同页面之间的数据传递

        也是一种跨域解决方案

• FormData 对象

        FormData对象用以将数据编译成键值对，以便用XMLHttpRequest来发送数据。

其主要用于发送表单数据，但亦可用于发送带键数据(keyed data)，而独立于表单使用。

• canvas 绘图

         用于图形的绘制， 标签只是图形容器,绘制图形要用js来完成

• SVG 绘图

        SVG是指可伸缩的矢量图形

        HTML 

        SVG 使用 XML 格式定义图形,SVG 图像在放大或改变尺寸的情况下其图形质量不会有损失

       

注意:以上内容仅为面试时回答问题的简单概述,具体详情请自行百度