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的答案:

$height = $('#image_id').height();
$width  = $('#image_id').width();

使用jQuery，你可以这样做:

var imgWidth = $("#imgIDWhatever").width();

让我们将在这里学到的所有内容组合成一个简单的函数(imageDimensions())。它使用承诺。

// helper to get dimensions of an image const imageDimensions = file => new Promise((resolve, reject) => { const img = new Image() // the following handler will fire after a successful loading of the image img.onload = () => { const { naturalWidth: width, naturalHeight: height } = img resolve({ width, height }) } // and this handler will fire if there was an error with the image (like if it's not really an image or a corrupted one) img.onerror = () => { reject('There was some problem with the image.') } img.src = URL.createObjectURL(file) }) // here's how to use the helper const getInfo = async ({ target: { files } }) => { const [file] = files try { const dimensions = await imageDimensions(file) console.info(dimensions) } catch(error) { console.error(error) } } <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.0.0-beta.3/babel.min.js"></script> Select an image: <input type="file" onchange="getInfo(event)" /> <br /> <small>It works offline.</small>

我对jQuery的看法

免责声明:这并不一定能回答这个问题，但可以拓宽我们的能力。它在jQuery 3.3.1中进行了测试

让我们考虑一下:

你有图像的URL/路径，你想要得到图像的宽度和高度，而不是在DOM上渲染它， 在DOM上呈现图像之前，您需要将offsetParent节点或图像div包装器元素设置为图像的宽度和高度，以便为不同的图像大小创建一个流体包装器，即，当单击按钮以查看模式/灯箱上的图像时

我要这样做:

// image path
const imageUrl = '/path/to/your/image.jpg'

// Create dummy image to get real width and height
$('<img alt="" src="">').attr("src", imageUrl).on('load', function(){
    const realWidth = this.width;
    const realHeight = this.height;
    alert(`Original width: ${realWidth}, Original height: ${realHeight}`);
})

尼基·德·梅耶要了一张背景照片;我只是从CSS内容中获取它，并替换“url()””:

var div = $('#my-bg-div');
var url = div.css('background-image').replace(/^url\(\'?(.*)\'?\)$/, '$1');
var img = new Image();
img.src = url;
console.log('img:', img.width + 'x' + img.height); // Zero, image not yet loaded
console.log('div:', div.width() + 'x' + div.height());
img.onload = function() {
  console.log('img:', img.width + 'x' + img.height, (img.width/div.width()));
}