jQuery操作样式及属性样式

一、jQuery操作样式

css操作

1、设置单个样式

//css(name, value);
//name：需要设置的样式名称 ;value：对应的样式值
$("#one").css("background","gray");//将背景色修改为灰色

2、设置多个样式

//css(obj);
//参数是一个对象，包含了需要设置的样式名和样式值
$("#one").css({
    "background":"gray",
    "width":"400px",
    "height":"200px"
});

3、获取样式

//css(name);
//name:需要获取的样式名称
$("div").css("background-color");
//返回第一个元素对应的样式值。

class操作

1、添加类

//addClass(name)
//name:需要添加的样式类名
$("div").addClass("one);

2、移除类

//removeClass(name);
//name::需要移除的样式类名
$("div").removeClass("one);

3、判断类

//hasClass(name)
//name:用于判断的样式类名，返回值为true false
$("div").hasClass("one);

4、切换类

//addClass(name)
//name:需要切换的样式类名，有则移除该样式,无则添加该样式
$("div").toggleClass("one);

二、jQuery属性样式

attr操作

1、设置单个属性

//attr(name, value);
//name：需要设置的属性名 ;value：对应的属性值
$("img").attr("title","哎哟，不错哦");

2、设置多个属性

//attr(obj);
//参数是一个对象，包含了需要设置的属性名和属性值
$("img").attr({
    title:"哎哟，不错哦",
    alt:"哎哟，不错哦"
});

3、获取属性

//attr(name)
//name:需要获取的属性名称，返回对应的属性值
var oTitle = $("img").attr("title");
//返回第一个元素对应的样式值。

4、移除属性

//removeAttr(name);
//name:需要移除的属性名
$("img").removeAttr("title");

prop操作

在jQuery1.6之后，对于布尔类型的属性（checked、selected、disabled），不能用attr方法，只能用prop方法。

//设置属性
$(“:checked”).prop(“checked”,true);
//获取属性
$(“:checked”).prop(“checked”);//返回true或者false