Holen Sie sich echte Breite und Höhe der Website Bilder

Question

Auf jeder Website gibt es viele übergroße Bilder. Mit oversized meine ich, dass die Breite und Höhe des realen Bildes höher sind als die Stelle, die für das Bild durch HTML- und/oder CSS-Regeln zur Verfügung steht. Die Ursache ist - Bilder werden vom Browser herunterskaliert.

Wie ist es möglich, die Bilder von einer Website mit ihren tatsächlichen und verfügbaren Größen zu erhalten?

Answer 1

Wenn ich Ihren Beitrag richtig verstanden habe, können Sie naturalWidth und naturalHeight verwenden, um die ursprünglichen Abmessungen eines Bildes zu bestimmen.

img = document.getElementById('image'); 
 

 
img.addEventListener('load', function() { 
 
    console.log('width', img.naturalWidth); 
 
    console.log('height', img.naturalHeight); 
 
});

#image { 
 
    width: 200px; 
 
}

<img id="image" src="http://i.imgur.com/PDE3MLe.jpg" />