Wie kann ich mit JavaScript die Breite und Höhe eines Bildes ermitteln?

Bildabmessungen mit JavaScript abrufen

Benötigen Sie eine Möglichkeit, die Abmessungen eines Bildes auf einer Webseite zu bestimmen? JavaScript bietet eine einfache Lösung für diese Aufgabe.

Bildgröße ermitteln

Um Bildabmessungen programmgesteuert zu erhalten, verwenden Sie den folgenden JavaScript-Code:

const img = new Image();
img.onload = function() {
  alert(this.width + 'x' + this.height);
}
img.src = 'http://www.google.com/intl/en_ALL/images/logo.gif';

In diesem Snippet wird ein neues Image-Objekt erstellt. Der Onload-Ereignis-Listener wird zugewiesen, um das Bild zu verarbeiten, sobald es vollständig geladen ist. Der Listener ruft dann die Breiten- und Höheneigenschaften des Bildobjekts ab, die die Abmessungen des Bildes darstellen.

Für DOM-Bilder

Für Bilder, die bereits im DOM vorhanden sind können Sie direkt auf deren Breite und Höhe zugreifen Eigenschaften:

const img = document.getElementById('my-image');
alert(img.offsetWidth + 'x' + img.offsetHeight);

Überlegungen

Beachten Sie, dass bei diesem Ansatz das Bild geladen werden muss, bevor seine Abmessungen abgerufen werden können. Bei Bildern, die dynamisch geladen werden oder nicht sofort sichtbar sind, müssen Sie möglicherweise sicherstellen, dass sie vollständig geladen sind, bevor Sie auf ihre Eigenschaften zugreifen.

Das obige ist der detaillierte Inhalt vonWie kann ich mit JavaScript die Breite und Höhe eines Bildes ermitteln?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!