javascript - 如何找到base64图像的宽度和高度

Question

如何找到base64图像的宽度和高度

<img id="thumb0" width="200" height="200" 
src="data:image/png;base64, ................">

图像属性宽度和高度是恒定的，因为我需要将它们显示为缩略图，但是原始图像属性不同。

我需要获取原始图像的高度和宽度。

假设我的原始图像高度和宽度是750 X 500

我试过这样但得到属性宽度和高度

$("#thumb0").width();

值为200。

请帮助如何获得图像的原始宽度和高度。

Answer 1

您可以构建另一个图像元素并获取其大小：

var img = new Image();
img.src = $('#thumb0').attr('src');
var originalWidth = img.width;

Answer 2

dystroy 的答案中提到的 HTMLImageElements的Image() 构造函数是正确的方法，但有一个警告：构造函数实际上是异步的！因此，您可能会在某些浏览器中遇到意外行为；从我有限的实验来看，dystroy 的代码将在 Chrome 中 100% 的运行，但有时在 Firefox 和 Safari 中运行。不知道别人。

正确的方法似乎是使用 onload handler，如：

var img = new Image();
img.src = some_base64_image_source;
console.log(img.width);       // This might print out 0!
img.onload = function() {
    console.log(img.width);   // This will print out the width.
}