Get srcset Image heruntergeladen

Question

Wie kann ich das eigentliche Bild aus dem Browser heruntergeladen erhalten für:

<img src="small.jpg" srcset="small.jpg 200w, large.jpg 400w"> 

Wenn mein Bildschirmbreite größer als 400px das große Bild heruntergeladen werden. Wo kann ich den Weg finden? Das folgende gibt "small.jpg" zurück.

<script> 
    var i = $('img').attr('src'); 
    alert(i); //This returns "small.jpg" 
</script> 

Answer 1

jQuery attr() Methode gibt den eigentlichen HTML-Wert für das angegebene Attribut. jQuerys Methode gibt den aktuellen Wert für diese Eigenschaft zurück. Es wird generell empfohlen, .prop() statt .attr() zu verwenden.

So verwenden Sie diese:

var i = $('img').prop('currentSrc'); 

Answer 2

.currentSrc ist das Attribut für Sie suchen.
In jQuery wäre das .prop("currentSrc").

Es ist part of the HTML 5 standard, also sollte in der Theorie jeder Browser, der .srcset unterstützt, auch .currentSrc unterstützen.
Sie können testen, ob ein Browser mit unterstützt:

var supported = 'currentSrc' in new Image; 

Für ältere Browser, ich schlage vor, Sie zurück zu .src fallen, was der richtige Wert sein sollte, da srcset würde auch nicht unterstützt.

JS:

var img = document.querySelector('img'); 
var src = img.currentSrc || img.src; 

jQuery:

var img = $('img'); 
var src = img.prop('currentSrc') || img.prop('src');