HTML généré par javascript : css ignoré par IE
Bonsoir,
J'ai un petit soucis :
je génère des éléments html à l'aide de javascript/DOM (createElement), puis je donne à ces éléments des class CSS à l'aide de la méthode setAttribute avant d'insérer le noeud créé dans la page.
Seulement Internet Explorer (6 et 7) ne prends pas en compte les propriétés CSS que l'élément devrait avoir vis à vis de sa classe (sous firefox ça marche).
Un petit exemple qui illustre le problème :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
|
<style>
.uneClasse {color:red;}
</style>
<script type="text/javascript">
function creerSpan()
{
newSpan = document.createElement("span");
newSpan .setAttribute("class","uneClasse");
newSpan .innerHTML="Test";
document.getElementById("conteneur").appendChild(newSpan);
}
</script>
<div id="conteneur">
<span class="uneClasse">Test</span>
</div>
<button onclick="javascript:creerSpan();">Hop</button> |
ce code devrait en théorie ajouter des textes "Test" en rouge, ce que fait firefox mais pas IE (il crée les éléments mais ils restent noir), ce dernier semble ne pas appliquer de style lorsqu'un élément est rajouté dynamiquement par javascript.
Est-ce quelque chose qui m'échappe ? Un problème d'IE ? Quelqun a t'il déja été confronté à ce problème ?
Merci d'avance de vos lumières parce que là je sèche !
