我有 3 个 SVG，如下所示。我只能更改内联 SVG 的颜色。任何想法为什么？ (代码托管在 IIS 上)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<object id="objectSvg" type="image/svg+xml" data="eq.svg"></object>
<svg id="svg" width="100" height="100" viewBox="0 0 300 300">
<use xlink:href="eq.svg#EarthquakeSymbol"></use>
</svg>
<svg id="inline" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="none" x="0px" y="0px" width="300px" height="300px">
<circle cx="150" cy="150" r="140" stroke="black" stroke-width="20" fill="none"/>
<path id="mypath"stroke="#000000" stroke-width="20" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="3" fill="none" d="M 35.5 141.55 L 81.05 141.55 108.75 86.1 150.35 223.05 189.4 132.8 207.95 172.5 222.7 141.65 265.8 141.65"/>
</svg>
<script>
$('#objectSvg path').css({ stroke: "#ff0000" });
$('#svg path').css({ stroke: "#ff0000" });
$('#inlineSvg path').css({ stroke: "#ff0000" });</script>
</body>
</html>
最佳答案
我很确定您不能使用 css 设置外部加载的 SVG 的样式。为什么不像其他两个代码那样将外部 SVG 中的代码剪切并粘贴到您的 html 中？
这是有关使用 SVG 的信息的重要资源:https://css-tricks.com/using-svg/
关于javascript - 通过 jquery 使用外部源更改 SVG 的颜色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34108761/