Question

文件SVG包含高度和宽度的标题信息，单位为mm。

<?xml  version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Creator: CorelDRAW X6 -->
<svg xmlns="http://www.w3.org/2000/svg"  width="50.8mm"  height="55.0332mm"   version="1.1"   viewBox="0 0 5080 5503" />

我通过对象显示这些图像

<div id="panel">
      <object id="svg" class="group" data="none.svg" width="500" height="500"></object>        
</div>

var svg = document.getElementById('svg');
svg.setAttribute('data', 'one.svg');

但是，在某些浏览器中，它似乎不正确。要解决这个问题，我需要替换高度和宽度，为它们赋值100％

如何使用Javascript更改字符串？

width="50.8mm"  height="55.0332mm"

到

width="100%"  height="100%"

谢谢

Answer 1

在你的svg标签中，width和height是属性，所以你可以简单地写：

svg.setAttribute('width', '100%');
svg.setAttribute('height', '100%');

与设置/更改data属性的方式相同。

编辑：

尝试稍后加载（或重新加载）svg数据属性，例如：

var svg = document.getElementById('svg');
svg.setAttribute('width', '100%');
svg.setAttribute('height', '100%');
setTimeout(function(){svg.setAttribute('data', 'one.svg');},0);

编辑＃2：

如果我理解正确，您在svg文件中设置了特定的大小。然后，你应该编辑它。如果你需要在运行时由JS完成，你可以尝试这个脚本：

var container = document.getElementById('svg');
var innerDoc = container.contentDocument;
var svg = innerDoc.getElementsByTagName('svg')[0];
svg.setAttribute('width', '100%');
svg.setAttribute('height', '100%');

如何删除或替换svg root上的'width'和'height'属性使用Javascript？

1 个答案: