[DOM] fonction créerTable 2

**thomthomdevweb** · 07/10/2008, 20h52

Bonjour,
Pour mes cours de javascript, je dois créer une fonction me permettant de créer une table HTML avec en paramètres les rangées et les colonnes (exemple: function crerTable2(rangée,colonnes)).
voici la fonction de laquelle je dois impérativement m'inspirer bien que le résultat avec les dom soit une des solutions (voir code plus bas).

Voici l'énoncé:

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
<script language="javascript">
<!--
function creerTable1()
{
  document.write("<table border=1>");
  document.write("<br>");
  document.write("<tr>");
  document.write("<td>");
  document.write("&nbsp;"); // &nbsp;  désigne une espace insécable (non breaking space)
  document.write("</td>");
  document.write("</tr>");
  document.write("</table>")
}
// -->
</script>

Inspirez-vous de la fonction CreerTable1() ci-dessus pour créer une fonction CreerTable2 qui permette de créer une table HTML aux dimensions spécifiées par les paramètres. Le premier paramètre spécifie le nombre de rangées et le deuxième, le nombre de colonnes. Indice: vous devez utiliser des itérations (boucles) .

Voici le code avec les dom:

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
	 <html>
	 <head>
	 <script language="javascript">
	 <!--
 
function tab(col,lign)
{
  this.tab = document.createElement("table");
  this.autoid=1;
 
 for(j=0;j<lign;j++)
 {
 
   this.newRow = this.tab.insertRow(-1);
 
   for(i=0;i<col;i++)
   {
 
     this.newCell = this.newRow.insertCell(i);
     this.newCell.innerHTML =this.autoid;
     this.newCell.setAttribute("id",this.autoid);
 
 
     with(this.newCell.style)
     {
       borderStyle = 'solid';
       borderWidth = '2px';
       borderColor = "#000000";
       width = '100px';
       height = '50px';
       textAlign = 'center';
     }
 
   this.autoid++;
  }
 
 
}
 
  this.addtxt = function(id)
  {
    document.getElementById(id).innerHTML = "ne";
  }
 
 
 
 
 
  document.body.appendChild(this.tab);
 
 
 
}
-->
</script>
</head>
<body onload="tab(4,4)";>
</body>
</html>

Quelqu'un peut il m'aider à trouver l'autre solution?

Merci d'avance,
Thom

**Bovino** · 07/10/2008, 21h14

Bonjour,
Tout d'abord, merci d'utiliser les balises [code] dans l'éditeur (bouton '#').
Ensuite, ton prof ne semble pas très ami avec les standards... mais bon, c'est pas ta faute ! Effectivement, passer par le DOM est bien plus élégant...
Enfin, ta fonction (c'est mon jour de bonté !)

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
function creerTable2(lignes,colonnes)
{
document.write("<table border=1>");
// document.write("<br>"); une ligne d'un intérêt assez contestable...
for(var i=0;i<lignes;i++){
document.write("<tr>");
for(var j=0;j<colonnes;j++){
document.write("<td>");
document.write("&nbsp;"); // &nbsp; désigne une espace insécable (non breaking space)
document.write("</td>");
}
document.write("</tr>");
}
document.write("</table>")
}

Normalement, aux fautes de frappe et d'inattention près, c'est ça...

**le_chomeur** · 08/10/2008, 10h43

Code :

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

document.write

**Bovino** · 08/10/2008, 10h57

Ben oui, mais c'est la méthode demandée...

**le_chomeur** · 08/10/2008, 11h00

je sais je sais , juste une habitude ^^
je ne t'en veux pas bovino lol ( j'commence a connaitre ta façon de coder dont tu es pardonné

**E.Bzz** · 08/10/2008, 11h05

Bonjour,

Envoyé par thomthomdevweb

voici la fonction de laquelle je dois impérativement m'inspirer

alors, pour que ta réponse soit correcte, tu dois impérativement signaler en début d'exercice, que l'utilisation du document.write() pour modifier la structure d'un document est très fortement déconseillée et qu'il faut lui préférer les méthodes/fonctions du DOM, qui ne sont pas juste une "autre alternative", mais bien la solution préconisée par les normes de développement actuelles (bien que pour des raisons diplomatiques, il vaille mieux ne pas insister sur le côté actuel/obsolète

).

A+

**le_chomeur** · 08/10/2008, 11h09

Envoyé par E.Bzz

Bonjour,
(bien que pour des raisons diplomatiques, il vaille mieux ne pas insister sur le côté actuel/obsolète

).

A+

il est vrai qu'il serait bien que tu puisses expliquer a ton prof pourquoi nous te préconisons d'utiliser les méthodes du dom , plutôt que d'écrire de façon assez brut directement dans la page, mais s'il est de la vielle école , je ne pense pas qu'il soit au courant de la veille technologique

Bon courage pour la suite

**thomthomdevweb** · 08/10/2008, 11h55

Envoyé par le_chomeur

il est vrai qu'il serait bien que tu puisses expliquer a ton prof pourquoi nous te préconisons d'utiliser les méthodes du dom , plutôt que d'écrire de façon assez brut directement dans la page, mais s'il est de la vielle école , je ne pense pas qu'il soit au courant de la veille technologique

Bon courage pour la suite

Oui on va dire qu'il s'agit d'une autre génération (l'ancienne en l'occurence)mais apparemmetn ce serait pour mieux me faire comprendre l'utilisation des fonctions...Perso,je pense qu'avec les DOM c'est nettement plus intéressant :
les goûts et les couleurs!!!
A ce propos, je compte m'inscrire à des cours du soir pour aborder une autre approche de Javascript (plus récente) car il est vrai que je débute et que je n'ai pas trouvé de tuto convainquant...Donc si quelqu'un a un tuyeau je suis preneur!!!

**thomthomdevweb** · 08/10/2008, 11h57

Envoyé par Bovino

Bonjour,
Tout d'abord, merci d'utiliser les balises [code] dans l'éditeur (bouton '#').
Ensuite, ton prof ne semble pas très ami avec les standards... mais bon, c'est pas ta faute ! Effectivement, passer par le DOM est bien plus élégant...
Enfin, ta fonction (c'est mon jour de bonté !)

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
function creerTable2(lignes,colonnes)
{
document.write("<table border=1>");
// document.write("<br>"); une ligne d'un intérêt assez contestable...
for(var i=0;i<lignes;i++){
document.write("<tr>");
for(var j=0;j<colonnes;j++){
document.write("<td>");
document.write("&nbsp;"); // &nbsp; désigne une espace insécable (non breaking space)
document.write("</td>");
}
document.write("</tr>");
}
document.write("</table>")
}

Normalement, aux fautes de frappe et d'inattention près, c'est ça...

Merci infiniment Bovino!!!j'ai essayé de lancer la page mais ça ne m'a rien affiché.je vais revoir le code car j'ai juste fais un copier/coller sans entrer dans les détails.mais merci comme même!!!

[DOM] fonction créerTable 2

JavaScript

Discussions similaires

Partager

Partager