jquery的操作样式
class操作
(1)判断是否有样式类hasclass(name)//name:用于判断的样式类名，返回值为true false判断div是否有demo的样式类$(“div”).hasclass(“demo”)(2)添加样式类addclass(name)//name指需要添加的样式类名，注意参数不要带点.//给div添加demo的样式。$(“div”).addclass(“demo”);(3)移除样式类removeclass("name")//name:需要移除的样式类名//移除div中demo的样式$(“div”).removeclass(“demo”);
css操作(操作的是style属性)
(1)获取样式css(name)//name:需要获取的样式名称//获取div的背景颜色属性$("div").css("background-color");注意：获取样式操作只会返回第一个元素对应的样式值。(2)设置单个样式css(name,value)//name：需要设置的样式名称,value：对应的样式值//给一个div标签的背景修改成红色$("div").css("background","red");（3）设置多个样式css(obj)//参数是一个对象，对象中包含了需要设置的样式名和样式值//例如$("#one").css({ "background":"gray", "width":"400px", "height":"200px"});
案例分享：隔行变色
通过jquery中的css操作和class操作来改变背景颜色的不同
<!doctype html><html><head><meta charset="utf-8"></head><body> <style> *{ padding: 0; margin:0; } ul{list-style: none; } li{ width:300px; height:30px; background-color:rgb(14,150,249); } .even{ background-color:rgb(241,70,215); } </style> <ul> <li>第一个</li> <li>第二个</li> <li>第三个</li> <li>第四个</li> <li>第五个</li> <li>第六个</li> </ul><script src="jquery/jquery-1.12.4.js"></script> <script> $(function(){//给奇数的li修改背景颜色$("li:odd").css("backgroundcolor","pink");//给偶数的li添加even类$("li:even").addclass('even');});</script></body></html>
效果图：
总结：以上就是本篇文章的内容了，希望对大家学习jquery内容有所帮助。
以上就是如何利用jquery中css和class方法进行样式操作的详细内容。