只能改变”；停止颜色“；一次使用JavaScript

我的功能很简单，如下所示：

function changeColor(color, opacity, obj) {
    var colors = obj.getElementsByClassName("color_elem");

    for (var i = 0; i < colors.length; i++) {
        mainInterface.makeToast("Color " + i + ": " + color);
        colors[i].style.stopColor = color;
        colors[i].style.stopOpacity = opacity;
        //colors[i].setAttribute("stop-color", color);
        //colors[i].setAttribute("stop-opacity", opacity);
    }
}

函数更改颜色（颜色、不透明度、obj）{
var colors=obj.getElementsByClassName（“color_elem”）；
对于（变量i=0；i

此函数可以多次调用。它可以通过按钮点击事件触发，也可以通过界面触发。作为参数，它会得到一种类似于

#FFFFFF

的颜色，一种介于0到1之间的不透明度，以及一个在任何情况下都是svg元素的obj

当第一次调用函数时，它会像我预期的那样更改颜色。第二次叫它，它不会。它将保留第一次函数调用指定的颜色

使用

mainterface.makeToast（“颜色”+i+：“+Color”）我确保我拥有正确的颜色，我拥有正确的颜色

我尝试使用css属性和属性。（见评论）

有什么想法吗？
在一些浏览器中，我在Chrome（62.0.3202.94）和Opera（49.0.2725.39）中遇到了同样的问题，但在Firefox开发（58.0b5）和Edge（38.14393.0.0）中工作得非常好

在不起作用的浏览器中，SVG在调整窗口大小时变为正确的颜色；因此，我的技巧是在JS代码中“修改”（我说“修改”，因为可以保留原始值，也可以工作）SVG高度

因此，如果SVG元素的高度为100px，则可以在更改停止颜色后执行此操作：

$('#svg').attr("height","100px");

（我在示例中使用了JQuery，因为我无法使用纯JS进行此攻击，不知道为什么抱歉）
您可以在这里或jsbin.com/jsfiddle.net上发布所有相关代码（包括HTML）吗？我们可以再多一些代码吗！如果我足够清楚地理解您的功能，
.color\u elem
是渐变中的
元素。您的函数应用于所有颜色相同的对象。那么为什么要使用渐变，而不是简单地更改它们的
fill
属性呢？