Question

jquery设置一个标签的多个属性值，代码写得很臃肿请教高手帮我简化一下！！！

$(".num3_top").css("background","url(../../images/weike/num1_top.jpg) no-repeat");
$(".num3_bottom").css("background","url(../../images/weike/num1_down.jpg) no-repeat");
$(".num3_cen").css("border-left","#EFB418 3px solid");
$(".num3_cen").css("border-right","#EFB418 3px solid");
$(".num2_top").css("background","url(../../images/weike/hui1.jpg) no-repeat");
$(".num2_bottom").css("background","url(../../images/weike/hui2.jpg) no-repeat");
$(".num2_cen").css("border-left","#C7C6C4 3px solid");
$(".num2_cen").css("border-right","#C7C6C4 3px solid");
$(".num1_top").css("background","url(../../images/weike/hui1.jpg) no-repeat");
$(".num1_bottom").css("background","url(../../images/weike/hui2.jpg) no-repeat");
$(".num1_cen").css("border-left","#C7C6C4 3px solid");
$(".num1_cen").css("border-right","#C7C6C4 3px solid");
就这段代码···麻烦帮我简化一下··········感激不尽！
其实我是想知道怎么用jquery同时改变多个样式 下面这位高手的$(".num1_cen").attr("style","border-left:#C7C6C4 3px solid;border-right:#C7C6C4 3px solid;");
我试了下·改变不了···麻烦高手告诉我一下····！！！！

Answer 1

应该可以不用jquery就能实现,直接css不行吗？
能简化的也不多
比如
$(".num1_cen").attr("style","border-left:#C7C6C4 3px solid;border-right:#C7C6C4 3px solid;");
或者
<style>
.cen{border-left:border-left:#C7C6C4 3px solid;border-right:#C7C6C4 3px solid;}
</style>
$(".num1_cen").addClass("cen");

追问

就像上面张图片一样·我切成了上中下三个部分··点击整个模块的时候，下部分跟下部分会改变背景图片。中间部分会改变border的颜色，所以就用jquery了，其实我想知道jquery怎么同时设置多个样式 就像您上面写的$(".num1_cen").attr("style","border-left:#C7C6C4 3px solid;border-right:#C7C6C4 3px solid;");貌似没有效果··麻烦高手帮我再解答一下·感激不尽······

Answer 2

没必要用JQ，css代码直接写到样式表就行了
<style>
.num3_top{background","url(../../images/weike/num1_top.jpg) no-repeat}
下面省略……
</style>

如果非得要用JQ，可以写
<style>
.class_01{background","url(../../images/weike/num1_top.jpg) no-repeat}
下面省略……
</style>
$(".num3_top").addClass("class_01");
下面省略……

Answer 3

在这些div标签最外面加一个div标签例如：
<div class="warp">
<div class="warp01"></div>
<div class="warp02"></div>
<div class="warp03"></div>
</div>

jquery给class="warp"加一个类名editcss
<div class="warp editcss">
<div class="warp01"></div>
<div class="warp02"></div>
<div class="warp03"></div>
</div>
然后css文件里派生定义样式
.editcss .warp01{}
.editcss .warp02{}
.......