![](/img/trans.png)
[英]Is it possible to use webkit css masks with SVG without an external file?
[英]Is it possible to use both an external css stylesheet / js file and an external svg file?
I want to use external css / js files in altering an external svg file, however, upon "importing" the svg file into the html, its "subtags" such as path are not imported, and therefore the css and js cannot alter it.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<object data="map.svg" type="image/svg+xml"></object>
<script src="map.js"></script>
</body>
</html>
我已經看到了多個我認為不起作用的解決方案。 如果有人可以解釋這些或提出自己的建議,我將不勝感激。
提前致謝!
如果 SVG 與文檔具有相同的主機,您可以使用getSVGDocument從 JavaScript 獲取 SVG 文檔
<object id="map" data="js.svg" type="image/svg+xml"></object>
<script>
const mapObject = document.getElementById("map");
mapObject.addEventListener("load", () => {
mapObject
.getSVGDocument()
.querySelector("path")
.setAttribute("fill", "red");
});
</script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.