应用jquery操作元素样式（二）

1.如何获取、设置某个元素行内单个、多个css样式
2.如何通过fn来设置元素css样式
3.如何给元素添加单个、多个css类
4.如何删除某个元素的单个、多个css类
5.如何切换默认样式和指定样式
6.如何通过fn设置切换规则


//添加一个样式
/**
$(function(){
$('div').addClass('red');
})
*/


//添加多个样式
/**
$(function(){
$('div').addClass('red bg');
})
*/


//删除单个样式
/**
$(function(){
$('div').removeClass('red');
})
*/


//删除多个样式
/**
$(function(){
$('div').removeClass('red bg');
})
*/


//添加单一监听事件
/**
$(function(){
$('div').click(function(){
$('div').addClass('red');
});
})
*/


//toggle方法样式切换,点击切换到设置样式，再次点击切换到默认样式
/**
$(function(){
$('div').click(function(){
$('div').toggleClass('red');
})
})
*/


//多个样式切换,判断是否有该属性，有就删除，添加上相应的样式；
/**
$(function(){
$('div').click(function(){
if ($('div').hasClass('blue')) {
$('div').removeClass('blue');
$('div').addClass('red');
}else if($('div').hasClass('red')){
$('div').removeClass('red');
$('div').addClass('blue');
}
});
})
*/


//设置多个样式，用链式语法
/**
$(function(){
$('div').click(function(){
if ($('div').hasClass('blue')) {
$('div').removeClass('blue').addClass('red');
}else if($('div').hasClass('red')){
$('div').removeClass('red').addClass('blue');
}
});
})
*/