JS与jQuery获取指定class名称的3种方式总结

// 获取元素的class名称
var element = document.querySelector('.qipa250');
// 获取当前元素的类名
console.log(element.className);
// 使用classList获取所有类名
console.log(element.classList);
// 添加类名
element.classList.add('new-class');
// 删除类名
element.classList.remove('qipa250');
// 切换类名
element.classList.toggle('new-class');

// 获取元素的class名称
var element = $('.qipa250');
// 获取当前元素的类名
console.log(element.attr('class'));
// 添加类名
element.addClass('new-class');
// 删除类名
element.removeClass('test');
// 切换类名
element.toggleClass('new-class');

// 获取元素的class名称
var element = document.querySelector('.qipa250');
// 添加类名，改变样式
element.classList.add('new-class');
element.style.color = '#ff0000';
// 切换类名，切换样式
element.classList.toggle('new-class');
element.classList.toggle('test');

// 获取元素的class名称
var element = document.querySelector('.qipa250');
// 添加类名，实现动画效果
element.classList.add('animated', 'bounce');
// 5秒后删除类名，取消动画效果
setTimeout(function(){
element.classList.remove('animated', 'bounce');
}, 5000);