Ajouter un nœud dans un DOM

Seb, lundi 22 décembre 2014 à 03h19

Bonjour,

Pour un chat, je récupère, à intervalle régulier, une liste de messages au format XML. Ainsi, je peux mettre à jour un DOM à partir duquel j'affiche l'historique des messages.

Lorsque j'envoi un message, j'aimerais ne pas attendre le prochain rafraîchissement pour le voir apparaître dans l'historique, sur la page du visiteur. Pour cela, je voudrais ajouter mon nœud message au DOM pour l'afficher immédiatement avant de l'envoyer réellement.

Voici un code simplifié du problème : (voir en live)

<?php
header('Content-type: text/xml');
?>
<corp>
    <lu valeur="0"/>
    <clavier valeur="0"/>
    <connecte valeur="0"/>
    <message heure="03h57" avatar="avatar1.jpg" id_auteur="1" contenu="Au revoir"/>
    <message heure="03h56" avatar="avatar1.jpg" id_auteur="1" contenu="Puis-je vous aider ?"/>
    <message heure="03h55" avatar="avatar1.jpg" id_auteur="1" contenu="Comment allez vous ?"/>
    <message heure="03h54" avatar="avatar1.jpg" id_auteur="1" contenu="Bonjour"/>
</corp>

<!DOCTYPE>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Probleme Javascript</title>
    </head>

    <body>
        <input type="button" onclick="lire_messages(false)" value="sans le message en plus" />
        <input type="button" onclick="lire_messages(true)" value="avec le message en plus" />
    </body>

    <script>

        // Cette fonction doit ajouter un noeud message au DOM
        function ajouter_un_message(ndom)
        {
            // Ici, comment ajouter un noeud <message/> supplementaire disant par exemple "a bientot" ?


            return ndom;
        }

        function lire_messages(ajouter_message)
        {
            // Construction de l'objet pour lancer la requette
            var xhr=new XMLHttpRequest();

            // Description de la fonction a appeler lors de la reponse a la requette
            xhr.onreadystatechange = function() {

                // Si la reponse nous est parvenue sans probleme
                if(xhr.readyState == 4 && xhr.status == 200)
                {
                    // Lecture des messages bruts
                    var ndom=xhr.responseXML;

                    // Si on doit ajouter un message
                    if (ajouter_message)
                    {
                        // Ajout du message
                        ndom = ajouter_un_message(ndom);
                    }

                    // Affichage des messages bruts
                    alert ((new XMLSerializer()).serializeToString(ndom));
                }
            };

            // Lancement de la requette HTTP
            xhr.open('GET', 'xml_gen.php', true);
            xhr.send(null);
        }

    </script>
</html>