IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[DOM] Modifier la taille d'une cellule d'un tableau


Sujet :

JavaScript

  1. #1
    Membre expérimenté Avatar de DoubleU
    Profil pro
    Inscrit en
    Janvier 2006
    Messages
    1 106
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2006
    Messages : 1 106
    Points : 1 388
    Points
    1 388
    Par défaut [DOM] Modifier la taille d'une cellule d'un tableau
    Est-ce que c'est moi qui devient fou ou est-ce qu'il y a une raison qui fait que le code suivant n'affiche rien sous ie (6 et 7):

    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
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     
    	<head>
    	</head>
     
    	<body>
    		<script type="text/javascript">
     
    			var table = document.createElement("table");
    			var tr = document.createElement("tr");
    			var td = document.createElement("td");
    			var td2 = document.createElement("td");
     
    			tr.appendChild(td);
    			tr.appendChild(td2);
    			table.appendChild(tr);
    			document.body.appendChild(table);
     
    			td.style.backgroundColor="red";
    			td.style.width = "100px";
    			td.style.height = "20px";
     
    			td2.style.backgroundColor="blue";
    			td2.style.width = "50px";
    			td2.style.height = "20px";
     
    		</script>
    	</body>
     
    </html>
    Alors que dans FF on a bien le résultat attendu et que dans le module IE Developer Toolbar, on voit bien les éléments qui sont ajoutés au dom avec leurs bonnes dimensions...

  2. #2
    Membre émérite
    Inscrit en
    Septembre 2002
    Messages
    2 307
    Détails du profil
    Informations forums :
    Inscription : Septembre 2002
    Messages : 2 307
    Points : 2 814
    Points
    2 814
    Par défaut
    enleve les px.

  3. #3
    Expert éminent sénior

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Points : 36 571
    Points
    36 571
    Par défaut
    Bonjour,
    as-tu essayé d'inverser l'ordre d'ajout dans la page
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    document.body.appendChild(table);
    table.appendChild(tr);
    tr.appendChild(td2);
    tr.appendChild(td);
    ?

    A+

  4. #4
    Membre expérimenté Avatar de DoubleU
    Profil pro
    Inscrit en
    Janvier 2006
    Messages
    1 106
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2006
    Messages : 1 106
    Points : 1 388
    Points
    1 388
    Par défaut
    Matthieu2000 >> ca marche pas mieux, et sous FF ca fait des carrés de 1x1

    E.Bzz >> Meme résultat. Je crois que j'ai du tester a peu prêt tous les ordres possibles en plus lol

  5. #5
    Expert éminent sénior

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Points : 36 571
    Points
    36 571
    Par défaut
    Alors fait de ton script une fonction (en conservant l'ordre que je t'ai donné) que tu appelleras sur le onload du body.
    Au moins, le document sera complètement créé au moment de l'exécution ...

    A+

  6. #6
    Membre expérimenté Avatar de DoubleU
    Profil pro
    Inscrit en
    Janvier 2006
    Messages
    1 106
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2006
    Messages : 1 106
    Points : 1 388
    Points
    1 388
    Par défaut
    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
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     
    	<head>
    			<script type="text/javascript">
    			function test(){	
    				var table = document.createElement("table");
    				var tr = document.createElement("tr");
    				var td = document.createElement("td");
    				var td2 = document.createElement("td");
     
    				document.getElementById("dd").appendChild(table);
    				table.appendChild(tr);
    				tr.appendChild(td2);
    				tr.appendChild(td);
     
    				td.style.backgroundColor="red";
    				td.style.width = "100px";
    				td.style.height = "20px";
     
    				td2.style.backgroundColor="blue";
    				td2.style.width = "50px";
    				td2.style.height = "20px";
    			}
    		</script>
     
     
    	</head>
     
    	<body>
    		<div id="dd"></div>
    		<input type="button" onclick="test()" value="go" />
    	</body>
     
    </html>
    Pareil.

    Si ca se trouve c'est vraiment un truc tout con mais a force d'etre dessus, je vois plus rien

  7. #7
    Membre émérite
    Inscrit en
    Septembre 2002
    Messages
    2 307
    Détails du profil
    Informations forums :
    Inscription : Septembre 2002
    Messages : 2 307
    Points : 2 814
    Points
    2 814
    Par défaut
    il faut un element tbody entre le table et le tr

  8. #8
    Membre expérimenté Avatar de DoubleU
    Profil pro
    Inscrit en
    Janvier 2006
    Messages
    1 106
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2006
    Messages : 1 106
    Points : 1 388
    Points
    1 388
    Par défaut
    Bien vu

    Merci a tous, même si finalement je vais ptete plutot utiliser des divs au lieu d'un tableau, j'aurais au moins appris un truc ^^

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Utiliser une variable pour modifier la taille d'une cellule <td>
    Par morora69 dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 07/06/2010, 16h52
  2. Réponses: 4
    Dernier message: 04/06/2009, 01h34
  3. Réponses: 2
    Dernier message: 26/08/2008, 14h32
  4. Une image qui ne change pas la taille d'une cellule d'un tableau
    Par guejo dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 08/12/2006, 14h51
  5. Fixer la taille d'une cellule d'un tableau
    Par Philofish dans le forum Balisage (X)HTML et validation W3C
    Réponses: 8
    Dernier message: 25/08/2005, 16h04

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo