要得到自然的高度和宽度:

.naturalHeight document.querySelector (img); .naturalWidth document.querySelector (img); < img src = " img.png " >

如果你想获取样式的高度和宽度:

document.querySelector（“img”）.offsetHeight; document.querySelector（“img”）.offsetWidth;

你只能使用load事件的回调来做到这一点，因为图像的大小直到它实际完成加载才知道。类似于下面的代码……

var imgTesting = new Image();

function CreateDelegate(contextObject, delegateMethod)
{
    return function()
    {
        return delegateMethod.apply(contextObject, arguments);
    }
}

function imgTesting_onload()
{
    alert(this.width + " by " + this.height);
}


imgTesting.onload = CreateDelegate(imgTesting, imgTesting_onload);
imgTesting.src = 'yourimage.jpg';

var img = document.getElementById("img_id");
alert( img.height + " ;; " + img .width + " ;; " + img .naturalHeight + " ;; " + img .clientHeight + " ;; " + img.offsetHeight + " ;; " + img.scrollHeight + " ;; " + img.clientWidth + " ;; " + img.offsetWidth + " ;; " + img.scrollWidth )
//But all invalid in Baidu browser  360 browser ...

这个答案正是我所寻找的(在jQuery):

var imageNaturalWidth = $('image-selector').prop('naturalWidth');
var imageNaturalHeight = $('image-selector').prop('naturalHeight');

只需传递input元素获得的“img”文件对象。当我们选择正确的文件时，它将给出图像的自然高度和宽度。

function getNeturalHeightWidth(file) {
    let h, w;
    let reader = new FileReader();
    reader.onload = () => {
        let tmpImgNode = document.createElement("img");
        tmpImgNode.onload = function() {
            h = this.naturalHeight;
            w = this.naturalWidth;
        };
        tmpImgNode.src = reader.result;
    };
    reader.readAsDataURL(file);

    }

    return h, w;
}

在使用真实图像大小之前，您应该加载源图像。如果使用jQuery框架，可以以简单的方式获得真实图像大小。

$("ImageID").load(function(){
  console.log($(this).width() + "x" + $(this).height())
})