Comment ajouter dynam tag dynamiquement en html en utilisant javascript/

Question

Je crée dynamiquement un div et je veux l'ajouter à l'intérieur d'un autre div.

  (js) var divtag = document.createElement("div"); 
       divtag.innerHTML = xmlhttp.responseText;//Ajax call working fine 
       document.getElementById('con').appendChild(divtag); 

html:

enter code here <div id="con"></div> 

Le o/p Je reçois de l'appel AJAX est Ok, je suis en mesure de le voir dans le navigateur, mais quand je fais une source de vue, je suis incapable de voir la div et son contenu. Il faut donc:

enter code here <div id="con"> 
       <div> 
      Contents added @ runtime 
     </div> 
      </div> 

quelqu'un peut-il suggérer où je me trompe?

Answer 1

Vous ne verrez pas le code généré dans le navigateur par défaut, mais vous pouvez utiliser l'extension Firefox Web Developer pour afficher le code généré après l'exécution de js.

- modifier

extension également utile pour FF - Firebug.

Answer 2

Utilisez firebug - le meilleur addon de développement web firefox à mon avis.

Avec Firebug, vous pouvez consulter les DOM:

Answer 3

Avez-vous "con" div chargé sur notre DOM?

var divtag = document.createElement("div"); 
divtag.innerHTML = xmlhttp.responseText;//Ajax call working fine 
// See before adding a child, does it exist? 
alert(document.getElementById('con')); 
document.getElementById('con').appendChild(divtag); 

Je ne sais pas où vous avez ce code. Comme il est important que le DOM soit chargé avant de vérifier/assigner quoi que ce soit à un élément. Pour éviter une telle erreur:

function addEvent(obj, evType, fn){ 
if (obj.addEventListener){ 
    obj.addEventListener(evType, fn, false); 
    return true; 
} else if (obj.attachEvent){ 
    var r = obj.attachEvent("on"+evType, fn); 
    return r; 
} else { 
    return false; 
} 
} 
addEvent(window, 'load', function() { 
     var divtag = document.createElement("div"); 
     divtag.innerHTML = xmlhttp.responseText;//Ajax call working fine 
     // See before adding a child, does it exist? 
     alert(document.getElementById('con')); 
     document.getElementById('con').appendChild(divtag); 
});