Discussion :

[pekka77]

Bonjour,

J'utilise l'attribut innerHTML en JavaScript pour modifier le contenu d'une balise div. Voilà le code que j'ai tapé (en gros) :

Code :

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

1
2
3
 
 document.getElementById("mondiv").innerHTML = "<table>";
 alert(document.getElementById("mondiv").innerHTML);

Cependant le résultat affiché est : "<table></table>"
Or après ces lignes de code je continue à créer mon tableau en ajoutant des tr, td, etc. J'ai l'impression que l'attribut innerHTML ferme automatiquement les balises ouvertes. Comment empêcher cela ?

Merci beaucoup pour votre aide !

[siddh]

Code :

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

1
2
3
4
with(document.getElementById("mondiv")){
innerHTML = "<table>"; 
innerHTML += "<tr><td>coucou</td></tr>";
}

sinon apres tu passes par le dom et createElement

[pekka77]

justement ton code je ne crois pas qu'il fonctionne.
Sinon oui je pense passer par CreateElement.

J'ai une question à propos de cela d'ailleurs : comment ajouter un attribut à un élément qu'on a créé. Par exemple, je souhaiterai créer un élément "a" appartenant à "td". Ensuite je souhaite ajouter des attributs à "a". Comment faire cela ?

En gros j'aurai ce code :

Code :

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

1
2
3
4
5
6
7
 
ligne = document.createElement ('tr');
cell = document.createElement ('td');
lien = document.createElement('a');
cell.appendChild (lien);
ligne.appendChild(cell);
document.getElementById ('superTableau').appendChild (ligne);

Et bien sur un peu plus loin j'ai un tableau "vide" avec id="super Tableau".
Comment faire pour ajouter un attribut à l'élément 'a' (par exemple onClick) Et comment ajouter son contenu ?

Merci beaucoup !

[pekka77]

Bon apparemment il faut faire qqch dans ce gout :

Code :

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

      attribut1 = document.createAttribute('onClick');

Mais je n'ai pas trouvé comment remplir le onClick...

Si vous savez comment faire merci de me l'indiquer

[denisC]

Fais un:

Code :

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

1
2
3
4
 
lien = document.createElement('a');
lien.setAttribute("onclick","pouf()");
cell.appendChild (lien);

Sinon, tu peux egalement utiliser la syntaxe habituelle:

Code :

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

1
2
3
4
 
lien.onclick="pouf()";
ou
lien.onclick=pouf;

Dernière possiblité, pour les evenements:

Code :

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

1
2
3
 
lien.attachEvent("click","pouf()"); //IE
lien.addEventListener("onclick",pouf,false) //FFx

[pekka77]

Bon j'ai réussi à ajouter un attribut (onClick).
Pour cela j'ai utiliser CreateAttribute.
Dans cette attribut je souhaite appelé une fonction javascript donc j'ai mis ce code :

Code :

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

1
2
 
        attribut.nodeValue = "javascript: mafonction();";

Mais la fonction ne s'execute pas quand je clique sur mon lien !!
Je ne vois pas du tout ce qui cloche.
J'ai visualisé ce code html à l'intérieur de mon tableau (à l'aide d'un alert de innerHTML) et mon code semble nickel! je vois pas du tout ce qui pourrait clocher!

Avez vous une réponse ?

[denisC]

attribut.nodeValue = "mafonction();";

javascript: ça sert à rien du tout, il attends pas une recette de crepes suzette

[siddh]

justement ton code je ne crois pas qu'il fonctionne.

tu crois pas ou t as essayé ?

le innerhtml marche tres bien, je sais pas ce que tu fais dans ton code ...

[SpaceFrog]

juste pour preciser la pensée de Denis C dans sa syntaxe entre le setAttribute et le onclick ...
il faut doubler les instruction si tu veux que ce soit pris en compte par IE et Firefox:

Code :

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

1
2
3
4
lien = document.createElement('a');
lien.setAttribute("onclick",function{pouf()});
lien.onclick= function {pouf()}
cell.appendChild (lien);

[siddh]

Code :

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

lien.onclick= function {pouf()}

ca marche pas pour les deux ca ?

[SpaceFrog]

non la combinaison des deux lignes marche pour les deux ...

Code :

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

1
2
lien.setAttribute("onclick",function{pouf()});
lien.onclick= function {pouf()}

sinon pour résoudre le problème de la concaténation de code ...
concatène le code de ton tableau dans une variable et n'attribue la variable en innerHTML qu'une fois le code complet... celà évitera à certains browsers de faire de l'autocomplétion ..

[siddh]

jamais eu d'erreur d autocomp pour le innerHTML quoique je m en sert plus remarque.

pour ton histoire du setAttribute, je ne fais que des machin.onclick=function et pourtant ca marche ie et ffx

[SpaceFrog]

???
ben pour moi le machin.onclick= ne fonctionne pas universellement

[siddh]

c'est bon a savoir alors, je le doublerais a l avenir au cas ou

[SpaceFrog]

je double toujours desormais...

[pekka77]

merci pour toutes vos réponses