HTMLImageElement: loading-Eigenschaft

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit März 2022 browserübergreifend verfügbar.

Die loading-Eigenschaft des HTMLImageElement-Interfaces gibt dem Browser einen Hinweis, wie das Laden des Bildes, das sich derzeit außerhalb des Sichtfensters befindet, gehandhabt werden soll. Dies hilft dabei, das Laden der Inhalte des Dokuments zu optimieren, indem das Laden des Bildes aufgeschoben wird, bis es voraussichtlich benötigt wird, anstatt es sofort beim initialen Laden der Seite zu laden. Es spiegelt das loading-Inhaltsattribut des <img>-Elements wider.

js
function addImageToList(url) {
  const list = document.querySelector("div.photo-list");

  const newItem = document.createElement("div");
  newItem.className = "photo-item";

  const newImg = document.createElement("img");
  newImg.loading = "lazy";
  newImg.width = 320;
  newImg.height = 240;
  newImg.src = url;

  newItem.appendChild(newImg);
  list.appendChild(newItem);
}

Das <img>-Element
Web-Performance im MDN Learning-Bereich
Lazy Loading im MDN-Web-Performance-Leitfaden

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

HTML DOM API
HTMLImageElement
Konstruktor
1. Image()
Instanzeigenschaften
Instanzmethoden
1. decode()
Vererbung
Verwandte Seiten für HTML DOM
Anleitungen
1. Verwenden von Microtasks in JavaScript mit queueMicrotask()
2. Im Detail: Microtasks und die JavaScript-Laufzeitumgebung

HTMLImageElement: loading-Eigenschaft

In diesem Artikel

Wert

Beispiele

Grundlegende Verwendung

Spezifikationen

Browser-Kompatibilität

Siehe auch

Help improve MDN