一.新增属性
querySelector querySelectorAll ClassList
<ul>
<li class="first">新闻1</li>
<li class="second">新闻2</li>
<li>新闻3</li>
<li>新闻4</li>
<li>新闻5</li>
</ul>
<script>
//*******************************querySelector****************************************
//通过标签选择器来获取元素，并且是第一个
var li = document.querySelector("li");
console.log(li);
//通过标签选择器来获取元素，并且是第一个
var li1 = document.querySelector(".first");
console.log(li1);
var li2 = document.querySelector(".second");
li2.style.background = "pink";
//*******************************querySelectorAll****************************************
var lis = document.querySelectorAll("li");
for(var i=0;i<lis.length;i++){
lis[i].style.background = 'teal';
}
//*******************************ClassList****************************************
// classList 属性返回元素的类名，作为 DOMTokenList 对象。
//该属性用于在元素中添加，移除及切换 CSS 类。
// classList 属性是只读的，但你可以使用 add() 和 remove() 方法修改它。
//兼容性：谷歌8.0+、IE10+、火狐3.6+
//语法：element.classList
// 方法：length add() contains() item(index) remove() toggle()
//为元素添加多个类:
document.getElementsByClassName(".second")[0].classList.add("second2","second3");
//为元素移除多个类:
document.getElementsByClassName(".second")[0].classList.remove("second2");
//为元素切换类:
document.getElementsByClassName(".second")[0].classList.toggle("newClassName");
</script>
二、音频
<audio src="someaudio.wav">您的浏览器不支持 audio 标签。</audio>
<audio src="" autoplay="autoplay" controls="controls" loop="loop" preload="preload"></audio>
<!--src:要播放的音频的 URL。-->
<!--autoplay:如果出现该属性，则音频在就绪后马上播放。-->
<!--controls:如果出现该属性，则向用户显示控件，比如播放按钮。-->
<!--loop:如果出现该属性，则每当音频结束时重新开始播放。-->
<!--preload:如果出现该属性，则音频在页面加载时进行加载，并预备播放。如果使用 "autoplay"，则忽略该属性。-->
三、视频
//*******************************Vedio****************************************
<video src="movie.ogg" controls="controls" autoplay="autoplay" controls="controls" height="300" loop="loop" preload="preload" width="300">您的浏览器不支持 video 标签。 </video>
<!--src:要播放的视频的 URL。。-->
<!--autoplay:如果出现该属性，则音频在就绪后马上播放。-->
<!--controls:如果出现该属性，则向用户显示控件，比如播放按钮。-->
<!--loop:如果出现该属性，则每当视频结束时重新开始播放。-->
<!--preload:如果出现该属性，则视频在页面加载时进行加载，并预备播放。如果使用 "autoplay"，则忽略该属性。-->
<!--width: 设置视频播放器的宽度。-->
<!--height: 设置视频播放器的高度。-->
四.Audio/Vedio 方法
//*******************************Audio/Vedio 方法****************************************
//addTextTrack() 向音频/视频添加新的文本轨道
//canPlayType() 检测浏览器是否能播放指定的音频/视频类型
//load() 重新加载音频/视频元素
//play() 向音频/视频添加新的文本轨道
//pause() 暂停当前播放的音频/视频
