使用jQuery獲取圖像的href，src，寬度和高度

我想獲取頁面上所有圖像的href，src，width，height。 jQuery代碼是使用jQuery獲取圖像的href，src，寬度和高度

$('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; 


});

不知道什麼是錯，有什麼想法嗎？

感謝讓

來源

2010-08-06 X10nD

檢查我更新的答案！ – 2010-08-06 20:07:47

好IMG標籤使用 'SRC' 而不是 'HREF'。

來源

2010-08-06 19:22:00 Paul

假設 – X10nD 2010-08-06 19:27:13

嗯，好吧，那麼你需要使用父母選擇器來獲取錨點。你能否詳細說明這個應用程序？內部圖像是縮略圖還是全部內容？如果你是第一次加載圖像，你將需要等到圖像加載，以知道寬度/高度，例如... – Paul 2010-08-06 19:31:04

嗯...我如何觸發頁面加載後的高度，我想獲得錨點 – X10nD 2010-08-06 19:35:12

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

我想這應該有助於

來源

2010-08-06 19:23:23

不起作用..... – X10nD 2010-08-06 19:35:31

，我不會感到驚訝，如果這行不通 - 至少，直到文件及其所有資源的完全加載。 HTML通常不會指定圖像的寬度或高度，除非它已在標籤本身中指定。

所以你至少要等待onload事件。

另一種解決方案可能會有點痛苦，那就是檢查服務器端圖像的渲染寬度和高度，並提供img width，height>屬性中的圖像寬度/高度。

來源

2010-08-06 19:57:31

假設你有這樣的標記：

<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]是順便attribute-ends-with selector。

來源

2010-08-06 20:05:53 BalusC

關於來自Rei的上述答案......這是正確的，您確實希望在開始抓取尺寸之前確保所有內容都已完全加載。一個有用的工具是jquery.imagesloaded。

來源

2012-03-06 13:30:27 snkashis

此示例適用於您的問題。

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

來源

2013-05-17 14:48:46 Elfego

使用jQuery獲取圖像的href，src，寬度和高度

回答

相關問題