前端进阶之HTML5新特性

1、新增语义化标签

语义签	表达
header	头部
nav	导航栏
section	某部分
dialog	一般用作对话框、提示框
article	页面中独立的内容区域
aside	侧边栏
details	某些细节描述
summary	包含details元素的标题
footer	尾部

                                                                                             

2、新增表单

Type	作用
color	弹出一个颜料板，可以选择颜色
data	自带的一个日期选择器，可以选择想要的日期
datatime	选择一个UTC时间
email	输入时自动校验是否为email格式
month	月份选择
number	只能输入数字类型
range	输入范围值
search	定义为一个搜索框
tel	只能输入电话号码
time	时间选择
url	地址输入域
week	主要用于时间-周的选择

3、新增表单元素

元素	作用
datalist	input元素的list属性与datalist元素的id绑定
keygen	验证用户的方法
output	计算机脚本输出等

4、新增表单属性  

属性	作用
placeholder	鼠标移入默认提示文本
required	表示此表单不能为空
height/width	定义imge表单的宽高
min/max	定义最小值和最大值
step	定义数字间隔
pattern	验证值
autofocus	进入页面或是刷新页面时，自动获取焦点
multipe	规定多选值

5、音频：audio；

      视频：video；

6、canvas

          在页面上添加此标签后相当于在页面上新增了一块画布，可以在画布上画出自己想

      要的图形或是动画，需要设置id、width、height三个属性。

  标签如下所示：

   <canvas id="myCanvas" width="500" height="500" />

7、地理定位

     调用方法：getCurrentPosition() ，此方法返回的是地理位置的经伟度，具体用法如下所示：

   <script>
      var x=document.getElementById("demo")
      function getLocation() {
        if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(showPosition)
        } else {
          x.innerHTML = "Geolocation is not supported by this browser."
        }
      }
      function showPosition(position) {
        x.innerHTML = "Latitude: " +
        position.coords.latitude +
        "<br />Longitude: " + 
        position.coords.longitude
      }
    </script>

8、新增本地存储

      localStorage：长期存储，不用的时候需要手动清除

      sessionStorage：短期相信，当前页面关闭的同时，所存储的数据则一起清除

9、新增事件

名称	作用
onresize	窗口大小改变时触发
ondrag	元素被拖拽时触发
onscroll	滚动条位置发生变化时触发
onmousewheel	鼠标滚轮转动时将被些事件监听到
onerror	能捕捉到发生的错误
onplay	媒体播放器在播放的时候触发
onpause	媒体播放器在停止的时候触发

10、WebSocket

        一种全双工通讯协议，又被称为长链，一般用于实时数据展示或是实时通信

11、行块级元素

            块级元素：div、p、h1~h5、ul、ol、li、table、hr、blockquote、address、                              menu、pre、header、footer、section、nav、aside、article

             行内元素：span、img、a、label、input、i、q、textarea、select、small、sub、sup、           strong、button