标签：
元素样式操作
元素样式操作包括了直接设置CSS样式、增加CSS类别、类别切换、删除类别这几种操作方法。而在整个jQuery使用频率上来看，CSS样式的操作也是极高的，所以需要重点
掌握。
CSS操作方法
| 方法名 | 描述 |
| css(name) | 获取某个元素行内的css样式 |
| css([name1,name2,name3]) | 获取某个元素行内多个css样式 |
| css(name,value) | 设置某个元素行内的css样式 |
| css(name,function(index,value) {}) | 设置某个元素行内的css样式 |
| css({name1:value1,name2:value2}) | 设置某个元素行内多个css样式 |
| addClass(class) | 给某个元素添加一个css类 |
| addClass(class1 class2 class3...) | 给某个元素添加多个css类 |
| removeClass(class) | 删除某个元素的一个css类 |
| removeClass(class1 class2 class3...) | 删除某个元素的多个css类 |
| toggleClass(class) | 来回切换默认样式和指定样式 |
| togggleClass(class1 class2 class3...) | 同上 |
| toggleClass(class,switch) | 来回切换样式的时候设置切换频率 |
| toggleClass(function() {}) | 通过匿名函数设置切换的规则 |
| toggleClass(function() {},switch) | 在匿名函数设置时也可以设置频率 |
| toggleClass(function(i,c,s) {},switch) | 在匿名函数设置时传递三个参数 |
有html代码(部分)如下：
<div style="color: red;"> <strong>www.ycku.com</strong> </div>
jQuery代码：
alert($("div").css("color")); //获取元素行内CSS样式的颜色 弹出rgb(255,0,0)
有html代码(部分)如下：
<div> <strong>www.ycku.com</strong> </div>
jQuery代码：
$("div").css("color", "red"); //设置元素行内CSS样式颜色为红色
有html代码(部分)如下：
<div style="color: red; width: 200px; height: 200px;"> <strong>www.ycku.com</strong> </div>
在CSS获取上，我们也可以获取多个CSS样式，而获取到的是一个对象数组，如果用传统方式进行解析需要使用for in遍历。
jQuery代码：
var box = $("div").css(["color","height","width"]); //返回原生的DOM对象数组
得到多个CSS样式的数组对象，我觉得应该是这种形式：
{ color:"red", width:"200px", height:"200px" }
所以：alert(box[0]);会返回undefined。alert(box["width"]);才会返回正确的值——200px。
所以才说如果用传统方式进行解析需要使用for in遍历。
for(var key in box) { alert(key+":"+box[key]); }
jQuery提供了一个遍历工具专门来处理这种对象数组，$.each()方法，这个方法可以轻松的遍历对象数组。
$.each(box, function(attr,value) { //遍历JavaScript原生态的对象数组 alert(attr+":"+value); });
使用$.each()可以遍历原生的JavaScript对象数组，如果是jQuery对象的数组怎么使用.each()方法呢？
html代码如下：
<div title="aaa"> <strong>www.ycku.com</strong> </div> <div title="bbb"> <strong>www.ycku.com</strong> </div>
jQuery代码：
alert($("div")[0]);// 原生的DOM对象
$("div"); //jQuery对象数组
jQuery对象的数组使用.each()方法如下：
$("div").each(function(index, element) { //element是原生的DOM对象
alert(index+":"+element);
});
标签：
原文地址：http://www.cnblogs.com/yerenyuan/p/5424060.html
