2 sinat 26662021 sinat_26662021 于 2016.03.28 11:04 提问

用jquery修改CSS的问题

有CSS代码 定义了一些一个叫data-classbreak的属性,取不同属性值时的style效果:

path[data-classbreak="classbreak0"] {
stroke: rgb(255, 245, 220); 
        stroke-width: 1pt; 
    stroke-opacity: 0.35; 
        fill:   #00008B;
        fill-opacity: 0.8;
    }

    path[data-classbreak="classbreak1"] {
    stroke: rgb(255 ,140 ,0); 
    stroke-width: 1pt; 
    stroke-opacity: 0.35; 
        fill: #1E90FF;
        fill-opacity: 0.8;
    }

    path[data-classbreak="classbreak2"] {
    stroke: rgb(255, 245, 220); 
        stroke-width: 1pt; 
    stroke-opacity: 0.35; 
        fill:   #00008B;
        fill-opacity: 0.8;
    }

            源代码中有一句, node.setAttribute("data-classbreak", “classbreak0”);
            即为一个节点的data-classbreak赋予classbreak0对应的style。
            现在我需要用jquey动态地修改例如path[data-classbreak="classbreak0"]中的fill属性,尝试   $("path[data-classbreak='classbreak0]").css("fill","#33FF00")并没有效果,请问应该怎么改?谢谢!

6个回答

u012392706
u012392706   2016.03.28 13:22
已采纳
 $(".path[data-classbreak='classbreak0]").css("fill","#33FF00"); //注意前面的“.”,表示样式,而单纯的path的话就表示path元素,而你的node里面并没有path这样的元素,肯定找不到的。汗!!!
dongfanglanyi
dongfanglanyi 赞同!
一年多之前 回复
u012392706
u012392706 还是建议你去看node生成的最终元素,方法在你已经采纳的那个问题的补充答案里面。
一年多之前 回复
showbo
showbo   Ds   Rxr 2016.03.28 14:21

path是svg对象,fill是属性,不是css,设置css没用,用attr

    $('path[data-classbreak="classbreak1"]').attr('fill','red')
qq_17637725
qq_17637725   2016.03.28 11:17

fill是样式属性$("path[data-classbreak='classbreak0]").style("fill","#33FF00")你试过这样么

runing22
runing22   2016.03.28 11:56
    $('path[data-classbreak="classbreak1"]').attr("data-classbreak","classbreak0");
dongfanglanyi
dongfanglanyi   2016.03.28 13:26

前面为什么有个path呢?
[data-classbreak="classbreak0"] {
stroke: rgb(255, 245, 220);
stroke-width: 1pt;
stroke-opacity: 0.35;
fill: #00008B;
fill-opacity: 0.8;
}

[data-classbreak="classbreak1"] {
stroke: rgb(255 ,140 ,0); 
stroke-width: 1pt; 
stroke-opacity: 0.35; 
    fill: #1E90FF;
    fill-opacity: 0.8;
}

[data-classbreak="classbreak2"] {
stroke: rgb(255, 245, 220); 
    stroke-width: 1pt; 
stroke-opacity: 0.35; 
    fill:   #00008B;
    fill-opacity: 0.8;
}

jQuery("[data-classbreak='classbreak0']").css("fill","#33FF00");
这样子就可以啊

CSDNXIAON
CSDNXIAON   2016.03.30 11:28

jquery关于修改css的属性值
jQuery 修改css效果
jQuery修改属性、css等
----------------------同志你好,我是CSDN问答机器人小N,奉组织之命为你提供参考答案,编程尚未成功,同志仍需努力!

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!