En utilisant innerHTML ajouter liste ordonnée échoue dans IE

Question

J'utilise le code Javascript suivant pour remplir un DIV avec une liste ordonnée:

// send script back in split list 
var scriptList = script.split("\n"); 
var finalScript = "<ol>\n"; 
var count = 0; 
while(scriptList.length >= count) { 
    if((scriptList[count]=="") || (scriptList[count] == undefined)) { 
     count ++; 
     continue; 
    } 

    finalScript = finalScript + "<li>" + scriptList[count] + "</li>\n"; 
    count ++; 
} 
finalScript = finalScript + "</ol>"; 
scriptingDiv.innerHTML = finalScript; 

Dans Firefox, si je regarde dans les DOM en utilisant Firebug, cela correctement traduit à la suivante et affiche correctement une liste ordonnée.

<ol> 
<li>This is the first item in the list</li> 
<li>This is the second item in the list</li> 
</ol> 

Dans IE, il affiche comme si les </li > balises sont < br/> balises et ne tient pas compte de tous les autres tags, comme celui-ci:

Ceci est le premier élément de la liste
Ceci est le deuxième élément de la liste

Ai-je besoin d'ajouter dynamiquement la liste ordonnée au DOM pour que cela fonctionne? Au lieu de simplement définir le code html dans la div en utilisant .innerHTML?

TIA

Answer 1

Ai-je besoin d'ajouter dynamiquement la liste ordonnée au DOM pour que cela fonctionne? Au lieu de simplement définir le code html dans la div en utilisant .innerHTML?

Oui

var scriptList = script.split("\n"); 
var count = 0; 
var ol = document.createElement("ol"); 

    for(var index=0; index<scriptList.length; index++) { 
     if(scriptList[index]!="") { 
      var li = document.createElement("li"); 
      li.innerHTML=scriptList[index]; 
      ol.appendChild(li); 
     } 
    } 

scriptingDiv.appendChild(ol); 

Answer 2

Pourquoi ne pas utiliser les méthodes de dom à la place? IE:

myOL = document.createElement("ol"); 
myLI = document.createElement("li"); 
myTxt = document.createTextNode("My Text!"); 
myLI.appendChild(myTxt); 
myOL.appendChild(myLI); 

etc