Catégorie: Développement

CSV vers tableau HTML

Idée interneUn outil manque ?

Convertissez du CSV en tableau HTML avec échappement

Collez des données CSV, séparées par point-virgule, tabulation ou barre verticale, et générez un balisage de tableau HTML, avec une option pour afficher la première ligne comme en-tête. Chaque valeur de cellule est échappée en HTML. Tout s'exécute entièrement dans votre navigateur.

Tableau de 2 ligne(s) généré dans votre navigateur.

HTML
<table>
  <thead>
    <tr><th>name</th><th>score</th><th>team</th></tr>
  </thead>
  <tbody>
    <tr><td>Ava</td><td>92</td><td>Blue</td></tr>
    <tr><td>Noah</td><td>88</td><td>Green</td></tr>
  </tbody>
</table>

Tout sur cette page est traité dans votre navigateur. Rien n'est envoyé.

À quoi sert cet outil

Publier un export CSV sous forme de tableau HTML implique en général d'écrire à la main le balisage `<table>`, `<tr>` et `<td>`, ce qui est fastidieux et source d'erreurs dès qu'une cellule contient des caractères comme `<` ou `&`. Cet outil analyse les données délimitées que vous collez, échappe chaque valeur de cellule pour qu'elle ne puisse jamais être prise pour du balisage, et écrit un `<table>` avec une ligne `<thead>` pour l'en-tête si vous le demandez et un `<tbody>` pour le reste.

Mode d'emploi

  1. Collez des données CSV ou délimitées, ou chargez l'exemple.
  2. Choisissez le séparateur et indiquez si la première ligne est un en-tête.
  3. Copiez le balisage de tableau HTML généré.

Confidentialité

Cet outil fonctionne entièrement dans votre navigateur. Ce que vous saisissez n'est jamais envoyé, stocké ni partagé : fermer l'onglet suffit à tout effacer.

Questions fréquentes

Mes données sont-elles envoyées quelque part ?
Non. L'analyse et la génération HTML se font en JavaScript directement dans la page, donc rien de ce que vous collez ne quitte votre appareil.
Le HTML est-il sûr à coller dans une page ?
Chaque valeur de cellule est échappée en HTML avant d'être écrite dans le balisage, afin que des caractères comme `<`, `&` et `"` dans vos données ne puissent pas être interprétés comme des balises ou des attributs.
Que se passe-t-il si mes données n'ont pas de ligne d'en-tête ?
Désactivez l'option d'en-tête ; chaque ligne est alors écrite comme une simple ligne `<td>` dans `<tbody>`, sans aucun `<thead>`.