JavaScript: получить размеры изображения

У меня есть только URL-адрес изображения. Мне нужно определить высоту и ширину этого изображения, используя только JavaScript. Изображение не может быть видимым для пользователя на странице. Как я могу получить его размеры?

Ответ 1

var img = new Image();

img.onload = function(){
  var height = img.height;
  var width = img.width;

  // code here to use the dimensions
}

img.src = url;

Ответ 2

Сделайте новый Image

var img = new Image();

Установите src

img.src = your_src

Получите width и height

//img.width
//img.height

Ответ 3

Это использует функцию и ждет ее завершения.

http://jsfiddle.net/SN2t6/118/

function getMeta(url){
    var r = $.Deferred();

  $('<img/>').attr('src', url).load(function(){
     var s = {w:this.width, h:this.height};
     r.resolve(s)
  });
  return r;
}

getMeta("http://www.google.hr/images/srpr/logo3w.png").done(function(test){
    alert(test.w + ' ' + test.h);
});

Ответ 4

Следующий код добавляет атрибут изображения Высота и ширина к каждому изображению на странице.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
function addImgAttributes()
{
    for( i=0; i < document.images.length; i++)
    { 
        width = document.images[i].width;
        height = document.images[i].height;
        window.document.images[i].setAttribute("width",width);
        window.document.images[i].setAttribute("height",height);

    }
}
</script>
</head>
<body onload="addImgAttributes();">
<img src="2_01.jpg"/>
<img src="2_01.jpg"/>
</body>
</html>

Ответ 5

Подобный вопрос задал и ответил, используя JQuery здесь:

Получить высоту ширины удаленного изображения с URL-адреса

function getMeta(url){
  $("<img/>").attr("src", url).load(function(){
     s = {w:this.width, h:this.height};
     alert(s.w+' '+s.h);      
  }); 
}

getMeta("http://page.com/img.jpg");