Javascript 获取SVG的高度/宽度<；img>；在Firefox中

我正在尝试使用

image.width

和

image.height

获取JS中创建的SVG元素的高度/宽度

在Chrome（最新版本）上，它返回一个宽度和高度，其中base64编码的SVG和数据URI都是

image.src

然而，在Firefox（最新版本）上，即使我设置了

图像.onload

侦听器，它们都返回

0

例子

---

显示问题。在Chrome和FF中打开它以查看不同的输出。其中有一个.jpg作为控件，在两者中都起作用。

经过一些研究，似乎浏览器在保留纵横比的同时为SVG提供了一些默认值，Chrome是350x150。Firefox会为这些值返回0

请将代码的相关部分添加到问题中。base64编码的svg图像数据的根元素上没有高度和宽度属性，因此没有要报告的高度和宽度。你对“Chrome工作正常”的定义是什么？你为什么认为它应该报告非零值，因为没有任何可用的值。不知道Chrome报告的是什么，似乎是Chrome的bug。@RobertLongson-我已经更改了措辞，删除了Chrome是正确的观点。事实证明，每个浏览器的句柄没有不同的高度/宽度，但Firefox是错误被捕获的地方，因为它在分区中使用。

// base64 encoded SVG - EXPECTED 250x150
const base64String = new Image();
base64String.src = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA5NS43IDU3LjQiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDk1LjcgNTcuNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxwYXRoIGQ9Ik0yNi44LDE2LjljLTUuOC0wLjEtMTEuMSwyLjMtMTQuOSw2LjJjLTAuMi0xLjQtMC4zLTIuOC0wLjMtNC4yQzExLjgsOC43LDIxLjEsMi4zLDMxLjUsMi41TDI5LjcsMEMxMy40LTAuOCwwLjMsMTIsMCwyOAoJYy0wLjMsMTYsOS4yLDI5LjEsMjUuNiwyOS4zbDAtMC4xYzAuMiwwLDAuMywwLjEsMC40LDAuMWMxMS4yLDAuMiwyMC40LTguNywyMC42LTE5LjlDNDYuOSwyNi4zLDM4LDE3LjEsMjYuOCwxNi45Ii8+CjxwYXRoIGQ9Ik03NS44LDE2LjlDNzAsMTYuOCw2NC43LDE5LjMsNjEsMjMuMmMtMC4yLTEuNC0wLjMtMi44LTAuMy00LjJDNjAuOCw4LjgsNzAuMSwyLjQsODAuNiwyLjZsLTEuOC0yLjQKCUM2Mi40LTAuNyw0OS4zLDEyLjEsNDksMjhjLTAuMywxNiw5LjIsMjkuMSwyNS42LDI5LjNsMC0wLjFjMC4yLDAsMC4zLDAuMSwwLjQsMC4xYzExLjIsMC4yLDIwLjQtOC43LDIwLjYtMTkuOQoJQzk1LjksMjYuNCw4NywxNy4xLDc1LjgsMTYuOSIvPgo8L3N2Zz4K";

base64String.onload = function() {
  console.log(base64String.width, base64String.height); // Returns 250 150 on Chrome, 0 0 on FF
};