一 . 新增的语义化标签
- 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 ')____通过元素选择器返回全部元素节点