Kategorien

← View All Tools

Bildquellen-Extraktor

Extrahieren Sie Bild-URLs (src-Attribute) aus HTML-Quellcode. Unterstützt lazy-loading Bilder und srcset-Attribute.

Extrahieren Sie auch aus data-src-Attributen (lazy-loading Bilder)

Extrahieren Sie auch aus srcset-Attributen (responsive Bilder)

Entfernt doppelte Bild-URLs aus den Ergebnissen

Wählen Sie, wie die extrahierten Bild-URLs sortiert werden sollen

Wichtige Fakten

Kategorie
Text Processing
Eingabetypen
textarea, checkbox, select
Ausgabetyp
json
Sample-Abdeckung
4
API verfügbar
Yes

Überblick

Der Bildquellen-Extraktor ist ein Online-Tool, mit dem Sie Bild-URLs aus HTML-Quellcode extrahieren können. Es unterstützt die Erkennung von Standard-src-Attributen sowie optional lazy-loading Bilder über data-src und responsive Bilder über srcset.

Wann verwenden

  • •Wenn Sie alle Bild-URLs aus einer Webseite oder HTML-Datei sammeln müssen.
  • •Wenn Sie lazy-loading Bilder mit data-src-Attributen analysieren möchten.
  • •Wenn Sie responsive Bilder mit srcset-Attributen extrahieren und Duplikate entfernen wollen.

So funktioniert es

  • •Fügen Sie den HTML-Quellcode in das Textfeld ein.
  • •Wählen Sie optional zusätzliche Optionen wie das Einbeziehen von data-src oder srcset.
  • •Klicken Sie auf Extrahieren, um die Bild-URLs zu erhalten.
  • •Die Ergebnisse werden als JSON-Liste ausgegeben, sortiert und ohne Duplikate je nach Einstellung.

Anwendungsfälle

Webentwicklung: Überprüfen und sammeln Sie alle Bild-URLs einer Seite für Debugging oder Migration.
SEO-Analyse: Extrahieren Sie Bild-URLs, um Alt-Texte, Ladezeiten oder Bildoptimierung zu analysieren.
Content-Management: Archivieren oder migrieren Sie Bilder von einer Webseite, indem Sie ihre URLs systematisch erfassen.

Beispiele

1. Produktbilder von einer E-Commerce-Seite extrahieren

Webentwickler
Hintergrund
Ein Webentwickler muss alle Produktbilder von einer Online-Shop-Seite extrahieren, um sie in ein neues CMS zu migrieren.
Problem
Manuell nach Bild-URLs im HTML-Code zu suchen ist zeitaufwendig und kann zu Fehlern führen.
Verwendung
Kopieren Sie den HTML-Quellcode der Produktseite und fügen Sie ihn in das Tool ein. Aktivieren Sie 'data-src-Attribute Einbeziehen', da die Seite lazy-loading verwendet.
Beispielkonfiguration
includeDataSrc: true, uniqueOnly: true, sortBy: alphabetical
Ergebnis
Eine sortierte Liste aller einzigartigen Bild-URLs, einschließlich lazy-loading Bilder, wird als JSON ausgegeben und kann für die Migration verwendet werden.

2. Responsive Bilder für SEO-Analyse sammeln

SEO-Spezialist
Hintergrund
Ein SEO-Spezialist möchte die srcset-Attribute von Bildern auf einer responsiven Webseite überprüfen, um die Bildoptimierung zu bewerten.
Problem
Die srcset-Attribute sind im HTML verstreut und schwer manuell zu erfassen.
Verwendung
Fügen Sie den HTML-Quellcode der Webseite ein und aktivieren Sie 'srcset-Attribute Einbeziehen'.
Ergebnis
Alle srcset-URLs werden extrahiert und als JSON-Liste bereitgestellt, sodass der Spezialist die Bildgrößen und Formate analysieren kann.

Mit Samples testen

html, image, video
Markdown-Link-Extraktor-Beispiele
Markdown-Beispieldokumente mit verschiedenen Linktypen zum Testen des Markdown-Link-Extraktor-Tools
title token extractor
image
Web Python Bildverarbeitung Beispiele
Web Python Bildverarbeitungsbeispiele mit PIL/Pillow einschließlich Lesen, Speichern, Skalieren und Formatkonvertierung
title token image
image
Windows C++ Bildverarbeitung Beispiele
Windows C++ Bildverarbeitungsbeispiele einschließlich Bild-Laden/Speichern, Größenänderung und Formatkonvertierung mit Windows Imaging Component
title token image
image
macOS Swift Bildverarbeitung Beispiele
macOS Swift Bildverarbeitungsbeispiele einschließlich Laden/Speichern, Filterung und Transformationen
title token image
image

Verwandte Hubs

Html-Convert-Tools
Entdecken Sie 11 html-Tools für convert-Workflows und vergleichen Sie ähnliche Utilities schnell.
Image-Convert-Tools
Entdecken Sie 100 image-Tools für convert-Workflows und vergleichen Sie ähnliche Utilities schnell.
Video-Convert-Tools
Entdecken Sie 36 video-Tools für convert-Workflows und vergleichen Sie ähnliche Utilities schnell.
Image-Tools
Entdecken Sie 40 image-Tools für utility-Workflows und vergleichen Sie ähnliche Utilities schnell.

FAQ

Welche Bild-Attribute werden extrahiert?

Das Tool extrahiert primär src-Attribute, und optional data-src für lazy-loading sowie srcset für responsive Bilder.

Kann ich Duplikate in den Ergebnissen entfernen?

Ja, aktivieren Sie die Option 'Duplikate Entfernen', um nur einzigartige URLs anzuzeigen.

Wie werden die extrahierten URLs sortiert?

Sie können zwischen keiner Sortierung oder alphabetischer Sortierung (A-Z) wählen.

Ist das Tool für große HTML-Dateien geeignet?

Ja, das Tool verarbeitet HTML-Quellcode beliebiger Länge, solange er in das Textfeld eingefügt werden kann.

In welchem Format werden die Ergebnisse ausgegeben?

Die extrahierten Bild-URLs werden als JSON-Array ausgegeben, das einfach kopiert oder weiterverarbeitet werden kann.

API-Dokumentation

Request-Endpunkt

POST /de/api/tools/image-source-extractor

Request-Parameter

Parameter-Name Typ Erforderlich Beschreibung
htmlCode textarea Ja -
includeDataSrc checkbox Nein Extrahieren Sie auch aus data-src-Attributen (lazy-loading Bilder)
includeSrcSet checkbox Nein Extrahieren Sie auch aus srcset-Attributen (responsive Bilder)
uniqueOnly checkbox Nein Entfernt doppelte Bild-URLs aus den Ergebnissen
sortBy select Nein Wählen Sie, wie die extrahierten Bild-URLs sortiert werden sollen

Antwortformat

{
  "key": {...},
  "metadata": {
    "key": "value"
  },
  "error": "Error message (optional)",
  "message": "Notification message (optional)"
}
JSON-Daten: JSON-Daten

MCP-Dokumentation

Fügen Sie dieses Tool zu Ihrer MCP-Server-Konfiguration hinzu: 

{
  "mcpServers": {
    "elysiatools-image-source-extractor": {
      "name": "image-source-extractor",
      "description": "Extrahieren Sie Bild-URLs (src-Attribute) aus HTML-Quellcode. Unterstützt lazy-loading Bilder und srcset-Attribute.",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=image-source-extractor",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Sie können mehrere Tools verketten, z.B.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, maximal 20 Tools.

Wenn Sie auf Probleme stoßen, kontaktieren Sie uns bitte bei [email protected]