H5后javascript的提升

JAVASCRIPT提升

DOM扩展

获取元素

~~~javascript
document.getElementsByClassName (‘class’);
//通过类名获取元素，以伪数组形式存在。

document.querySelector(‘selector’);
//通过CSS选择器获取元素，符合匹配条件的第1个元素。

document.querySelectorAll(‘selector’);
//通过CSS选择器获取元素，以伪数组形式存在。
~~~

类名操作

~~~javascript
Node.classList.add(‘class’);
//添加class

Node.classList.remove(‘class’);
//移除class

Node.classList.toggle(‘class’);
//切换class，有则移除，无则添加

Node.classList.contains(‘class’);
//检测是否存在class

jquery和H5操作类的API比较

box = document.querySelecter(‘.box’);

jquery	H5
$(‘.box’).addClass()	box.classlist.add()
$(‘.box’).removeClass()	box.classlist.remove()
$(‘.box’).toggleClass()	box.classlist.toggle()
$(‘.box’).hasClass()	box.classlist.contains()