javascript - 使用 JS 更改 svg 的 css 填充

Question

我正在尝试使用 JS 更改用 css 定义的 svg 填充颜色。由于某种原因，它不起作用。这是我的代码:

SVG 本身(简而言之):

<svg id="secondalert"><style>.cls-1{fill:#000000;}</style></svg>

和 JS 来定位和改变它:

function() {
    var svg_css = document.getElementsByClassName('.cls-1');

    if (random_value < 20) {
        svg_css.css({
            "fill": "#EF4136"
        });

    } else {
        svg_css.css({
            "fill": "#EF4136"
        });
    }
}

有些东西没有组合在一起，填充颜色保持黑色，因为它在样式标签中。 我做错了什么？

Answer 1

您可以使用 svg_css.style.fill = "#hexadecimal" 而不是使用 svg_css.css({"fill": "#hexadecimal"}) p>

而且，当您使用 getElementsByClassName 时，它会返回一个数组，而不是使用 getElementById 或选择数组中的元素:

svg_css = document.getElementsByClassName('.cls-1')[0];