Получите href, src, width, height изображения, используя jQuery

Question

Я хочу получить href, src, width, height всех изображений на странице.Код jQuery:

$('img:regex(data:extension, jpg)').each(function() {


var imgsrc = $(this).attr('href'); 

//$(this).attr('width') =0;                                     

var newImg = new Image();
newImg.src = imgsrc;    
var width = newImg.width;
//width is 0;


});

Не уверен, что не так, есть идеи?

Спасибо, Жан

Answer 1

Этот пример работает для вашей проблемы.

$("img").each(function(){
    alert($(this).attr('src') + " - " + $(this).attr('width') + " - " + $(this).attr('height'));
});

Answer 2

Ну, тэги IMG используют 'src', а не 'href'.

Answer 3

Что касается приведенного выше ответа от Рей ... это правильно, вы действительно хотите быть уверены, что все полностью загружено в первую очередь, прежде чем начать захват размеров.Полезным инструментом для этого является jquery.imagesloaded .

Answer 4

Предполагая, что у вас есть эта разметка:

<a href="link1"><img src="foo.jpg"></a>
<a href="link2"><img src="bar.jpg"></a>

Ссылку для переноса можно получить с помощью jQuery.closest() следующим образом:

$('img[src$=.jpg]').each(function() {
    $img = $(this);
    $link = $img.closest('a');
    var href = $link.attr('href');
    // ...

    // Assuming you want the image's client width/height:
    var width = $img.width();
    var height = $img.height();
    // ...
});

[name$=value] между прочим, селектор атрибута заканчивается символом .

Answer 5

Я не удивлюсь, если это не сработает - по крайней мере, пока документ и все его ресурсы не будут полностью загружены.HTML обычно не определяет ширину или высоту изображения, если это не указано в самом теге.

Так что вам, по крайней мере, придется ждать события onload.

ДругойРешение, которое может оказаться немного болезненным, состоит в том, чтобы проверить визуализированную ширину / высоту изображения на стороне сервера и указать это ватрибутов.

Answer 6

$('img').each(function() {
   var imgwidth  = $(this)[0].offsetWidth;
   var imgheight = $(this)[0].offsetHeight;
    console.log(imgwidth ,' X ' , imgheight);
});

Я думаю, что это должно помочь