HTML5

一 . 新增的语义化标签

• header(头部) , aside(侧边栏) , footer(底部) , section(整体板块) , article , nav

二 . audio , video

• 方法 : play() 播放 , pause() 暂停 , load() 重新加载
• 属性 : autopaly 自动播放 , loop 循环播放 , defaultMuted 静音 , paused (设置/返回暂停状态) , volume (设置/返回音量)
• 事件 :
  - abort (放弃加载音视频时触发)
  - canplay (开始加载音视频时触发)
  - pause (当音频/视频已暂停时触发)
  - paly(当音频/视频已开始或不再暂停时触发)
  - volumechange( 当音量已更改时触发)

三 . 进度条 , 量度器 (IE , Safari 不支持)

• process(进度条) : max 最大进度 , value 当前进度
• meter(量度器) : min<low<high<max 进度刻度 , value 当前进度

<button>点击进度到一半</button>
    <div class="wrap">
		进度条：<progress max="100" value="20"></progress>
		<br><br>
		度量器：<meter value="20" max="100" min="0" low="30" high="80"></meter>
	</div>
    <script>
        let btn = document.getElementsByTagName('button')[0]
        btn.onclick = ()=>{
            document.getElementsByTagName('progress')[0].value=50
            document.getElementsByTagName('meter')[0].value=50

        }
    </script>

四 . DOM查询操作

以getElementXXX形式 , 除了 id 返回的是一个元素对象 , 其它返回的都是一组元素对象

• document.getElementById(’ ')____________通过id属性返回一个元素节点对象
• docement.getElementByClassName(’ ')____通过class属性返回一组元素节点对象
• docement.getElementByTagName(’ ')______通过标签名返回一组元素节点对象
• docement.getElementByName( ’ ')________通过name属性返回一组元素节点对象
• docement.querySelect(’ #id / .class ')______通过元素选择器只返回第一个元素节点
• docement.querySelectAll( '#id / .class ')____通过元素选择器返回全部元素节点

五 . canvas

详情查看此链接