Heim > Web-Frontend > js-Tutorial > Hauptteil

HTML zu E-Mail

WBOY
Freigeben: 2024-08-08 15:40:32
Original
848 Leute haben es durchsucht

HTML To Email

Es war eine Herausforderung, E-Mails im HTML-Layout zu versenden, da die meisten Elemente und CSS-Eigenschaften in den meisten E-Mail-Clients nicht kompatibel sind. Sie können sie sich hier ansehen.

Während es viele E-Mails gibt, die Frameworks oder Bibliotheken erstellen, müssen Sie vordefinierte Komponenten wie Karte, Titel, Bild usw. verwenden oder erweitern. Obwohl es beim Versenden von E-Mails am zuverlässigsten ist, da es für die meisten E-Mail-Clients optimiert ist, möchten Sie möglicherweise Ihr vorhandenes HTML-Element verwenden.

Zu diesem Zweck habe ich diese Bibliothek entwickelt.

Sie können sich die Demo hier ansehen.

Dieser Artikel ist nur eine Einführung in meine Bibliothek und ich werde die intuitiven Ideen in der README.md-Datei des Github-Repositorys behandeln.

Lass uns anfangen.

Installation

Wählen Sie eine der folgenden Methoden.

  • NPM
npm install html-to-table
Nach dem Login kopieren
  • Github ESM-Modul
import HTML2Table from 'https://github.com/w99910/html-to-table/blob/master/dist/html-to-table.js'
Nach dem Login kopieren
  • Github CJS
const HTML2Table = require('https://github.com/w99910/html-to-table/blob/master/dist/html-to-table.cjs')
Nach dem Login kopieren

Initialisierung

let html2table = new HTML2Table;
Nach dem Login kopieren

Konvertieren Sie Ihr Element

Es gibt ein Tabellenelement zurück, das dem angegebenen Element ähnlich ist.
Es konvertiert auch SVG-Elemente in Img-Elemente.

html2table.convert(document.querySelector('your-element-to-convert'));
Nach dem Login kopieren

Optional: Sie können die Elemente beim Konvertierungsprozess ausschließen.

Verwenden Sie „excludeElementByPattern“, indem Sie das Regex-Muster als Zeichenfolge übergeben.

html2table.excludeElementByPattern('toolbar')

// or
html2table.excludeElementByPattern('(toolbar|title)')
Nach dem Login kopieren

Das ist alles.

Ich werde die Bibliothek weiterentwickeln, um mehr Layout und Szenarien zu bewältigen.

Bitte erwägen Sie, der Bibliothek einen Stern zu geben, wenn Sie sie nützlich finden.

Github-Link: https://github.com/w99910/html-to-table

Das obige ist der detaillierte Inhalt vonHTML zu E-Mail. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!