我需要获取外部 css 文件的内容,以便将其添加到 svg。
我正在寻找的实际上是 css 的 toString 方法。这可能吗?我还没有找到解决方案。
这是我正在寻找 svg 的解决方案 xml:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
width="10cm" height="5cm" viewBox="0 0 1000 500">
<defs>
<style type="text/css"><![CDATA[
rect {
fill: red;
stroke: blue;
stroke-width: 3
}
]]></style>
</defs>
<rect x="200" y="100" width="600" height="300"/>
</svg>
我尝试使用指向它的外部链接,但它没有呈现样式:
<?xml version="1.0" standalone="no"?>
<?xml-stylesheet href="mystyle.css" type="text/css"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
width="10cm" height="5cm" viewBox="0 0 1000 500">
<rect x="200" y="100" width="600" height="300"/>
</svg>
编辑:我本来应该添加这个的 我可以在浏览器中很好地渲染 svg,因为它可以访问 svg。
我需要做的是将 svg 发送到服务器进行进一步处理(转换格式、保存到数据库..)。问题是样式丢失,因为 svg xml 中不包含 css。我需要像上面的第一段代码一样将 css 添加到 svg 本身,这样我就可以保留样式。
最佳答案
如果您能够使用 JavaScript,您可以获得样式表的内容,如下所示:
[].slice.call(document.styleSheets[1].cssRules).forEach(function(rule){
console.log('rule:', rule.cssText)
})
document.styleSheets[1]
是您的样式表。
关于javascript - 是否可以使用 javascript 获取外部 css 文件的内容以添加到 svg 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17361652/