javascript - 使用 Javascript 更改 SVG 的颜色

Question

我试图弄清楚当我单击“中心”和“右侧”容器时，我的 .SVG 颜色会变为红色(从白色)。

我当前的 html 是:

<nav>
        <span class="nav-btn"> <img src="nav-icon.svg" style="width: 60px;height: 60px;"></span>
        <ul class="nav">
            <li><a href="#">Home</a></li>
            <li><a href="#">Prices</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
        </ul>
    </nav>

<div class="container" id= "left" >
        <h1 style="color:white"><a>HAIR</a></h1>
    </div>

    <div class= "container" id= "center">
        <h1 style="color:white"><a>BEAUTY<a/></h1>
    </div>

    <div class="container" id= "right">
        <h1 style="color:white"><a>BARBERS</a></h1>
    </div>
</div>

Answer 1

据我所知，您需要使 SVG 内联才能具有这样的样式。 SVG 内联后，您可以使用“填充”样式来更改颜色。

这里回答了一个骗人的问题:

img src SVG changing the fill color