A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://developer.mozilla.org/de/docs/Web/API/SVGImageElement/decode below:

SVGImageElement: decode()-Methode - Web-APIs | MDN

SVGImageElement: decode()-Methode

Baseline 2025

Newly available

Die decode()-Methode der SVGImageElement-Schnittstelle initiiert das asynchrone Dekodieren eines Bildes und gibt ein Promise zurück, das aufgelöst wird, sobald das Bild dekodiert ist und es sicher ist, es an das DOM anzufügen.

Syntax Parameter

Keine.

Rückgabewert

Ein Promise, das mit undefined erfüllt wird, sobald die Bilddaten bereit sind, verwendet zu werden, zum Beispiel durch Anhängen an das DOM, Ersetzen eines bestehenden Bildes usw.

Ausnahmen

Keine.

Beispiele

Im folgenden Beispiel wird wahrscheinlich ein leeres Bild auf der Seite angezeigt, während das Bild heruntergeladen wird:

const SVG_NS = "http://www.w3.org/2000/svg";
const svg = document.querySelector("svg");

const img = document.createElementNS(SVG_NS, "image");
img.src = "img/logo.svg";
svg.appendChild(img);

Die Verwendung von decode() verzögert das Einfügen des Bildes in das DOM, bis es vollständig heruntergeladen und dekodiert ist, wodurch das Problem des leeren Bildes vermieden wird:

const SVG_NS = "http://www.w3.org/2000/svg";
const svg = document.querySelector("svg");

async function getImage() {
  const img = document.createElementNS(SVG_NS, "image");
  img.src = "img/logo.svg";
  await img.decode();
  svg.appendChild(img);
  const text = document.createElementNS(SVG_NS, "text");
  text.textContent = "Image is fully loaded!";
  svg.appendChild(text);
}

Dies ist besonders nützlich, wenn Sie dynamisch ein bestehendes Bild durch ein neues ersetzen, und verhindert auch, dass nicht zusammenhängende Wiedergaben außerhalb dieses Codes aufgehalten werden, während das Bild dekodiert wird.

Spezifikationen Browser-Kompatibilität Siehe auch MDN-Feedback-Box War diese Übersetzung hilfreich?

Diese Seite wurde automatisch aus dem Englischen übersetzt.


RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4