jQuery操作样式及属性样式

时间:2022-10-19 19:49:00 作者:快盘下载人气:

一、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


  
  加载全部内容