Données multiples dans un tableau HTML

**kingston711** · 06/10/2020, 11h41

Bonjour,

je dois introduire dans un tableau en html ces données :

EN TETE DU TABLEAU :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Type de vaisseau|Nom du pilote|U:Unique/G:Générique|Explications|Coût|Pilotage|Attaque|Agilité|Structure|Bouclier|Energie|CAPACITES>>...|AMELIORATIONS POSSIBLES>>...

CONTENU DU TABLEAU :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
Chasseur X-Wing|Luke Skywalker|U|Quand vous défendez, vous pouvez échanger 1 de vos résultats <focus> contre un résultat <evade> .|28|8|3|2|3|2|0|CAPACITIES>>|Concentration|Acquisition de cible|ADDONS>>|Talent de pilote expérimenté|Torpille|Astromech
Chasseur X-Wing|Biggs Darklighter|U|Les autres vaisseaux alliés situés à portée 1 ne peuvent être les cibles d'attaques si l'assaillant est en mesure de vous attaquer à la place.|25|5|3|2|3|2|0|CAPACITIES>>|Concentration|Acquisition de cible|ADDONS>>|Torpille|Astromech
Chasseur X-Wing|Pilote de l'escadron Rouge|G|Véritable unité d'élite, l'escadron Rouge regroupait certains des meilleurs pilotes de l'Alliance rebelle.|23|4|3|2|3|2|0|CAPACITIES>>|Concentration|Acquisition de cible|ADDONS>>|Torpille|Astromech
Chasseur X-Wing|Pilote débutant|G|Conçu par Incom Corporation, le X-wing T-65 compta rapidement parmi les appareils militaires les plus efficaes de la galaxie et fut d'un réel secours pour la Rébellion.|21|2|3|2|3|2|0|CAPACITIES>>|Concentration|Acquisition de cible|ADDONS>>|Torpille|Astromech
Chasseur TIE|"Mauler Mithel"|U|Quand vous attaquez à portée 1, lancez 1 dé d'attaque supplémentaire.|17|7|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>|Talent de pilote expérimenté
Chasseur TIE|"Dark Curse"|U|Quand vous défendez, les vaisseaux qui vous attaquent ne peuvent ni utiliser de marqueurs de concentration ni relancer les dés d'attaque.|16|6|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>
Chasseur TIE|"Night Beast"|U|Après avoir éxécuté une manoeuvre verte, vous pouvez effectuer une action de concentration gratuite.|15|5|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>
Chasseur TIE|Pilote de l'escadron Noir|G|Le chasseur TIE n'a ni boucliers ni systèmes de survie, si bien que les pilotes ne peuvent compter que sur eux-mêmes.|14|4|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>|Talent de pilote expérimenté
Chasseur TIE|Pilote de l'escadron Obsidian|G|Son système de moteurs ioniques jumeaux fait du TIE un des chasseurs les plus maniables jamais produits.|13|3|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>
Chasseur TIE|Pilote de l'académie|G|Dévellopé par Sienar Fleet System, ce TIE/ln rapide et maniable devint le principal chasseur de l'Empire lors de la Guerre civile galactique.|12|1|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>
Chasseur X-Wing T-70|Poe Dameron|U|Tant que vous défendez ou que vous attaquez, si vous avez un marqueur de concentration, vous pouvez changer un de vos résutats <focus> pour un résultat <hit> ou <evade> .|31|8|3|2|3|3|0|CAPACITIES>>|Concentration|Acquisition de cible|Accélération|ADDONS>>|Talent de pilote expérimenté|Torpille|Astromech|Modification technologique
Chasseur X-Wing T-70|"As Bleu"|U|Lorsque vous effectuez une action accélération, vous pouvez utiliser le gabarit [ <turnleft> 1] ou [ <turnright> 1].|27|5|3|2|3|3|0|CAPACITIES>>|Concentration|Acquisition de cible|Accélération|ADDONS>>|Torpille|Astromech|Modification technologique
Chasseur X-Wing T-70|Vétéran de l'escadron Rouge|G|Version modernisée du concept classique, le chasseur X-wing T-70 d'Incom est le vaisseau de combat emblématique des forces de la Résistance qui s'opposent au Premier Ordre.|26|4|3|2|3|3|0|CAPACITIES>>|Concentration|Acquisition de cible|Accélération|ADDONS>>|Talent de pilote expérimenté|Torpille|Astromech|Modification technologique
Chasseur X-Wing T-70|Apprenti de l'escadron Bleu|G|Le nouveau design des réacteurs du modèle X-wing T-70 augmente considérablement sa maniabilité que ce soit dans l'espace ou lors de ses vols atmosphériques.|24|2|3|2|3|3|0|CAPACITIES>>|Concentration|Acquisition de cible|Accélération|ADDONS>>|Torpille|Astromech|Modification technologique
Chasseur TIE/fo|"As Omega"|U|Quand vous attaquez, vous pouvez dépenser un marqueur de concentration et une acquisition de cible que vous avez sur le défenseur pour changer tous vos résultats en résultats <criticalhit> .|20|7|2|3|3|1|0|CAPACITIES>>|Concentration|Acquisition de cible|Tonneau|Evasion|ADDONS>>|Talent de pilote expérimenté|Modification technologique

Voici mon code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
<!doctype html>
 
<html>
 
	<head>
 
		<meta charset="utf-8"/>                                               <!-- code purement HTML 5 : iso-8859-1 correspond au jeu de caractères ANSI ; utf-8 correspond au jeu de caractères utf8 -->
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1"/>   <!-- code HTML 4/HTML 5 : iso-8859-1 correspond au jeu de caractères ANSI ; utf-8 correspond au jeu de caractères utf8 -->
 
 
		<title>Titre de cette première page</title>
 
	</head>
 
	<body>
		<header> <!-- Sémantiquement, il s'agit de l'entête de page ; on y trouve habituellement un bandeau, un titre de site, un titre de page, une thématique abordée par la page ou le site, une illustration du site, ... -->
		</header>
 
		<nav> <!-- Sémantiquement et techniquement, c'est dans cette balise que l'on est placé les éléments de navigation principaux pour le site -->
		</nav>
 
		<main> <!-- Sémantiquement, on utilise cette balise pour le contenu principal de cette page, en relation avec la "thématique" qu'elle aborde -->
 
 
 
			<table border="1"> <!-- balise définissant un tableau -->
 
				<thead> <!-- balise regroupant les éléments d'entête du tableau -->
 
					<tr> <!-- table row définit une ligne du tableau -->
						<th>Type de vaisseau</th>
						<th>Nom du pilote</th>
						<th>U:Unique / G:Générique</th>
						<th>Explications</th>
						<th>Coût</th> 
						<th>Pilotage</th>
						<th>Attaque</th>
						<th>Agilité</th>
						<th>Structure</th> 
						<th>Bouclier</th>
						<th>Energie</th> 
						<th>CAPACITES>>...</th>
						<th>AMELIORATIONS POSSIBLES>></th>
					</tr>
 
				</thead>
 
				<tbody> <!-- balise regroupant les éléments principaux du tableau -->
					<tr>
						<td rowspan="4">Chasseur X-Wing</td>
						<td>Luke Skywalker</td> <!-- table data définit une cellule de données du tableau -->
						<td>U</td>
						<td>Quand vous défendez, vous pouvez échanger 1 de vos résultats &ltfocus&gt contre un résultat &ltevade&gt.</td>
						<td>28</td>
						<td>8</td>
						<td>3</td>
						<td>2</td>
						<td>3</td>
						<td>2</td>
						<td>0</td>
						<td rowspan="4">
							<ul>
								<li>Concentration</li>
								<li>Acquisition de cible</li>
							</ul>
						</td>
 
						<td>
							<ul>
								<li>Talent de pilote expérimenté</li>
								<li>Torpille</li>
								<li>Astromech</li>
							</ul>	
						</td>
					</tr>
					<tr>
 
						<td>Biggs Darklighter</td> <!-- table data définit une cellule de données du tableau -->
						<td>U</td>
						<td>Les autres vaisseaux alliés situés à portée 1 ne peuvent être les cibles d'attaques si l'assaillant est en mesure de vous attaquer à la place.</td>
						<td>25</td>
						<td>5</td>
						<td>3</td>
						<td>2</td>
						<td>3</td>
						<td>2</td>
						<td>0</td>
 
 
						<td rowspan="3">
							<ul>
 
								<li>Torpille</li>
								<li>Astromech</li>
							</ul>
						</td>
					</tr>
					<tr>
 
						<td>Pilote de l'escadron Rouge</td> <!-- table data définit une cellule de données du tableau -->
						<td>G</td>
						<td>Véritable unité d'élite, l'escadron Rouge regroupait certains des meilleurs pilotes de l'Alliance rebelle.</td>
						<td>25</td>
						<td>5</td>
						<td>3</td>
						<td>2</td>
						<td>3</td>
						<td>2</td>
						<td>0</td>
 
					</tr>
					<tr>
 
						<td>Pilote débutant</td> <!-- table data définit une cellule de données du tableau -->
						<td>G</td>
						<td>Conçu par Incom Corporation, le X-wing T-65 compta rapidement parmi les appareils militaires les plus efficaes de la galaxie et fut d'un réel secours pour la Rébellion.</td>
						<td>21</td>
						<td>2</td>
						<td>3</td>
						<td>2</td>
						<td>3</td>
						<td>2</td>
						<td>0</td>
					</tr>
					<tr>
						<td rowspan="5">Chasseur TIE</td>
						<td>Dark Curse</td> <!-- table data définit une cellule de données du tableau -->
						<td>U</td>
						<td>Quand vous défendez, les vaisseaux qui vous attaquent ne peuvent ni utiliser de marqueurs de concentration ni relancer les dés d'attaque.</td>
						<td>16</td>
						<td>6</td>
						<td>2</td>
						<td>3</td>
						<td>3</td>
						<td>0</td>
						<td>0</td>
						<td>
							<ul>
								<li>Concentration</li>
								<li>Tonneau</li>
								<li>Evasion</li>
							</ul>
						</td>
 
						<td>
 
						</td>
					</tr>
					<tr>
 
						<td>Night Beast</td> <!-- table data définit une cellule de données du tableau -->
						<td>U</td>
						<td>Après avoir éxécuté une manoeuvre verte, vous pouvez effectuer une action de concentration gratuite.</td>
						<td>15</td>
						<td>5</td>
						<td>2</td>
						<td>3</td>
						<td>3</td>
						<td>0</td>
						<td>0</td>
						<td>
							<ul>
								<li>Concentration</li>
								<li>Tonneau</li>
								<li>Evasion</li>
							</ul>
						</td>
 
						<td>
 
						</td>
					</tr>
					<tr>
 
						<td>Pilote de l'escadron Noir</td> <!-- table data définit une cellule de données du tableau -->
						<td>G</td>
						<td>Le chasseur TIE n'a ni boucliers ni systèmes de survie, si bien que les pilotes ne peuvent compter que sur eux-mêmes.</td>
						<td>14</td>
						<td>4</td>
						<td>2</td>
						<td>3</td>
						<td>3</td>
						<td>0</td>
						<td>0</td>
						<td>
							<ul>
								<li>Concentration</li>
								<li>Tonneau</li>
								<li>Evasion</li>
							</ul>
						</td>
						<td>
							<ul>
								<li>
									Talent de pilote expérimenté</li>
							</ul>
						</td>
 
 
					</tr>
					<tr>
 
						<td>Pilote de l'escadron Obsidian</td> <!-- table data définit une cellule de données du tableau -->
						<td>G</td>
						<td>Son système de moteurs ioniques jumeaux fait du TIE un des chasseurs les plus maniables jamais produits.</td>
						<td>13</td>
						<td>3</td>
						<td>2</td>
						<td>3</td>
						<td>3</td>
						<td>0</td>
						<td>0</td>
						<td>
							<ul>
								<li>Concentration</li>
								<li>Tonneau</li>
								<li>Evasion</li>
							</ul>
						</td>
 
					</tr>
					<tr>
 
						<td>Pilote de l'académie</td> <!-- table data définit une cellule de données du tableau -->
						<td>G</td>
						<td>Dévellopé par Sienar Fleet System, ce TIE/ln rapide et maniable devint le principal chasseur de l'Empire lors de la Guerre civile galactique.</td>
						<td>12</td>
						<td>1</td>
						<td>2</td>
						<td>3</td>
						<td>3</td>
						<td>0</td>
						<td>0</td>
						<td>
							<ul>
								<li>Concentration</li>
								<li>Tonneau</li>
								<li>Evasion</li>
							</ul>
						</td>
 
					</tr>
					<tr>
						<td rowspan="3">Chasseur X-Wing T-70</td>
						<td>Poe Dameron</td> <!-- table data définit une cellule de données du tableau -->
						<td>U</td>
						<td>Tant que vous défendez ou que vous attaquez, si vous avez un marqueur de concentration, vous pouvez changer un de vos résutats &ltfocus&gt pour un résultat &lthit&gt ou &ltevade&gt .</td>
						<td>31</td>
						<td>8</td>
						<td>3</td>
						<td>2</td>
						<td>3</td>
						<td>3</td>
						<td>0</td>
						<td>
							<ul>
								<li>Accélération</li>
								<li>Acquisition de cible</li>
							</ul>
						</td>
 
						<td>
							<ul>
								<li>Talent de pilote expérimenté</li>
								<li>Torpille</li>
								<li>Astromech</li>
								<li>Modification technologique</li>
							</ul>	
						</td>
					</tr>
					<tr>
						<tr>
 
						<td>As Bleu</td> <!-- table data définit une cellule de données du tableau -->
						<td>U</td>
						<td>Lorsque vous effectuez une action accélération, vous pouvez utiliser le gabarit [ &ltturnleft&gt 1] ou [ &ltturnright&gt 1].</td>
						<td>27</td>
						<td>5</td>
						<td>3</td>
						<td>2</td>
						<td>3</td>
						<td>3</td>
						<td>0</td>
						<td>
							<ul>
								<li>Accélération</li>
								<li>Acquisition de cible</li>
								<li>Concentration</li>
							</ul>
						</td>
 
						<td>
							<ul>
 
								<li>Torpille</li>
								<li>Astromech</li>
								<li>Modification technologique</li>
							</ul>	
						</td>
					</tr>
					<tr>
 
 
 
				</tbody>
 
 
 
			</table>
 
		</main>
 
 
 
		<footer> <!-- Sémantiquement, il s'agit du pied de page ; on y trouve généralement des données sur la confection du site, des moyens de contacter ou de s'informer vis à vis du créateur et/ou du gestionnaire du site -->
		</footer>
 
	</body>
 
</html>

La liste de l'énoncé est bien plus longue que ça, je voudrais savoir si il y a un moyen d'entrer le contenu du tableau qui est dans l'énoncé sans faire du copier coller ( qui est long et fastidieux ).
Car il faut faire un copier coller de chaque information entre les | | | | | et ca prend un temps fou. Dans l'énoncé, j'ai mis +- 20 lignes de contenu, mais j'en ai une centaine à traiter.

Merci pour votre aide

**javatwister** · 07/10/2020, 21h40

Salut,

Début de piste:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title></title>
 
<style type="text/css">
td, th{border:1px solid}
</style>
 
</head>
<body>
 
  <table>
    <thead id="h"></thead>
    <tbody id="tb"></tbody>
  </table>
 
<script>
const titre=document.querySelector("#h").appendChild(document.createElement("tr"));
`Type de vaisseau|Nom du pilote|U:Unique/G:Générique|Explications|Coût|Pilotage|Attaque|Agilité|Structure|Bouclier|Energie|CAPACITES>>...|AMELIORATIONS POSSIBLES>>`
.split(/\|/).forEach(v=>{
        (titre.appendChild(document.createElement("th")).appendChild(document.createTextNode(v)))
})
 
const d=`Chasseur X-Wing|Luke Skywalker|U|Quand vous défendez, vous pouvez échanger 1 de vos résultats <focus> contre un résultat <evade> .|28|8|3|2|3|2|0|CAPACITIES>>|Concentration|Acquisition de cible|ADDONS>>|Talent de pilote expérimenté|Torpille|Astromech
Chasseur X-Wing|Biggs Darklighter|U|Les autres vaisseaux alliés situés à portée 1 ne peuvent être les cibles d'attaques si l'assaillant est en mesure de vous attaquer à la place.|25|5|3|2|3|2|0|CAPACITIES>>|Concentration|Acquisition de cible|ADDONS>>|Torpille|Astromech
Chasseur X-Wing|Pilote de l'escadron Rouge|G|Véritable unité d'élite, l'escadron Rouge regroupait certains des meilleurs pilotes de l'Alliance rebelle.|23|4|3|2|3|2|0|CAPACITIES>>|Concentration|Acquisition de cible|ADDONS>>|Torpille|Astromech
Chasseur X-Wing|Pilote débutant|G|Conçu par Incom Corporation, le X-wing T-65 compta rapidement parmi les appareils militaires les plus efficaes de la galaxie et fut d'un réel secours pour la Rébellion.|21|2|3|2|3|2|0|CAPACITIES>>|Concentration|Acquisition de cible|ADDONS>>|Torpille|Astromech
Chasseur TIE|"Mauler Mithel"|U|Quand vous attaquez à portée 1, lancez 1 dé d'attaque supplémentaire.|17|7|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>|Talent de pilote expérimenté
Chasseur TIE|"Dark Curse"|U|Quand vous défendez, les vaisseaux qui vous attaquent ne peuvent ni utiliser de marqueurs de concentration ni relancer les dés d'attaque.|16|6|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>
Chasseur TIE|"Night Beast"|U|Après avoir éxécuté une manoeuvre verte, vous pouvez effectuer une action de concentration gratuite.|15|5|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>
Chasseur TIE|Pilote de l'escadron Noir|G|Le chasseur TIE n'a ni boucliers ni systèmes de survie, si bien que les pilotes ne peuvent compter que sur eux-mêmes.|14|4|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>|Talent de pilote expérimenté
Chasseur TIE|Pilote de l'escadron Obsidian|G|Son système de moteurs ioniques jumeaux fait du TIE un des chasseurs les plus maniables jamais produits.|13|3|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>
Chasseur TIE|Pilote de l'académie|G|Dévellopé par Sienar Fleet System, ce TIE/ln rapide et maniable devint le principal chasseur de l'Empire lors de la Guerre civile galactique.|12|1|2|3|3|0|0|CAPACITIES>>|Concentration|Tonneau|Evasion|ADDONS>>
Chasseur X-Wing T-70|Poe Dameron|U|Tant que vous défendez ou que vous attaquez, si vous avez un marqueur de concentration, vous pouvez changer un de vos résutats <focus> pour un résultat <hit> ou <evade> .|31|8|3|2|3|3|0|CAPACITIES>>|Concentration|Acquisition de cible|Accélération|ADDONS>>|Talent de pilote expérimenté|Torpille|Astromech|Modification technologique
Chasseur X-Wing T-70|"As Bleu"|U|Lorsque vous effectuez une action accélération, vous pouvez utiliser le gabarit [ <turnleft> 1] ou [ <turnright> 1].|27|5|3|2|3|3|0|CAPACITIES>>|Concentration|Acquisition de cible|Accélération|ADDONS>>|Torpille|Astromech|Modification technologique
Chasseur X-Wing T-70|Vétéran de l'escadron Rouge|G|Version modernisée du concept classique, le chasseur X-wing T-70 d'Incom est le vaisseau de combat emblématique des forces de la Résistance qui s'opposent au Premier Ordre.|26|4|3|2|3|3|0|CAPACITIES>>|Concentration|Acquisition de cible|Accélération|ADDONS>>|Talent de pilote expérimenté|Torpille|Astromech|Modification technologique
Chasseur X-Wing T-70|Apprenti de l'escadron Bleu|G|Le nouveau design des réacteurs du modèle X-wing T-70 augmente considérablement sa maniabilité que ce soit dans l'espace ou lors de ses vols atmosphériques.|24|2|3|2|3|3|0|CAPACITIES>>|Concentration|Acquisition de cible|Accélération|ADDONS>>|Torpille|Astromech|Modification technologique
Chasseur TIE/fo|"As Omega"|U|Quand vous attaquez, vous pouvez dépenser un marqueur de concentration et une acquisition de cible que vous avez sur le défenseur pour changer tous vos résultats en résultats <criticalhit> .|20|7|2|3|3|1|0|CAPACITIES>>|Concentration|Acquisition de cible|Tonneau|Evasion|ADDONS>>|Talent de pilote expérimenté|Modification technologique`
.split(/$/m);
 
d.forEach(v=>{
        let tb=document.querySelector("#tb").appendChild(document.createElement("tr"));
        v.split(/\|/).forEach(v2=>{
                (tb.appendChild(document.createElement("td")).appendChild(document.createTextNode(v2)))
        })
});
</script>
 
</body>
</html>

Données multiples dans un tableau HTML

HTML

Discussions similaires

Partager

Partager