Heim  >  Artikel  >  Web-Frontend  >  Wie konvertiere ich Base64 in ein Bild in JavaScript/jQuery?

Wie konvertiere ich Base64 in ein Bild in JavaScript/jQuery?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-10-28 03:48:30263Durchsuche

How to Convert Base64 to an Image in JavaScript/jQuery?

Base64 in ein Bild in JavaScript/jQuery konvertieren

In Ihrem Bilderfassungscode haben Sie das Bild erfolgreich erfasst und als Base64 gespeichert Zeichenfolge in der Variable item_image. Um diesen Base64-String in ein Bild zu konvertieren und seinen Pfad clientseitig zu verwenden, führen Sie die folgenden Schritte aus:

Erstellen eines Bildobjekts:

Erstellen eines neuen Bildobjekts in JavaScript:

<code class="javascript">var image = new Image();</code>

Festlegen der Bildquelle:

Setzen Sie die src-Eigenschaft des Bildobjekts auf die Base64-Zeichenfolge, einschließlich des „data:image...“-Vorworts:

<code class="javascript">image.src = 'data:image/png;base64,' + item_image;</code>

Anzeigen des Bildes:

Sobald das Bild geladen ist, können Sie es auf der Seite anzeigen, indem Sie es an den Dokumenttext anhängen:

<code class="javascript">document.body.appendChild(image);</code>

Dadurch wird das Base64-Bild auf der Webseite gerendert.

Daten-URIs:

Das zum Codieren des Bildes im src-Attribut verwendete Format wird aufgerufen ein „Daten-URI“. Es wird von allen gängigen Browsern unterstützt und ermöglicht das direkte Einbetten von Daten, beispielsweise einem Bild, in eine Webseite.

Das obige ist der detaillierte Inhalt vonWie konvertiere ich Base64 in ein Bild in JavaScript/jQuery?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn