Message d'erreur Échec de l'exécution de 'appendChild' sur 'Node' : le paramètre 1 n'est pas de type 'Node'


Nico

J'essaie de remplir ma liste mobile jquery en utilisant ajax pour obtenir ma liste de titres de films en effectuant une requête php Mysql avec des données en json. J'ai réussi à obtenir les données dans le bon format json, mais dans mon javascript, j'obtiens l'erreur en ligne... li.appendChild("a")

HTML 
<div data-role="main"  class="ui-content">
         <ul data-role="listview" id="list" >
         </ul >
</div>
getcatagories2_mobile.php

<?php

include("includes/connection.php");

$q="Comedy";

$resultActor = mysqli_query($con,"SELECT id,title, plot,catagory,release_date,rated FROM ".TBL_DATA." WHERE catagory LIKE '%".$q."%' ORDER BY title  ");    

$x= array();

    while($rowMovie = mysqli_fetch_array($resultActor)) {
        $x[]= array("Category" => $rowMovie['title']);

        }
       $jsonarray=json_encode($x);
       echo $jsonarray;

?>
successful sample JSON format output

[{"Category":"22 Jump Street"},{"Category":"27 Dresses"}]
my called javascript function using ajax...

var xhr = new XMLHttpRequest();

        xhr.open("GET", "getcatagories2_mobile.php", true); 

            xhr.onreadystatechange = function() 
            {
                if (xhr.readyState == 4 && xhr.status == 200) 
                {
                  var list = document.getElementById("list");
                  var data= xhr.responseText;
                  var vec= JSON.parse(data);
                        vec.forEach(
                              function(ob)
                              {
                                  var li = document.createElement("li");
                                  var a = document.createElement("a");
                                  var text = document.createTextNode("ob.Category");
                                  a.appendChild(text);
                                  a.setAttribute("href","#");
                                  li.appendChild("a");
                                  list.appendChild("li");

                              }
                         ); 
            $('#list').listview('refresh');  

            }
         }
                      xhr.send();


    };

lorsque j'ai utilisé le débogage google, j'obtiens mon erreur sur la ligne-> li.appendChild("a"), lorsque je survole var vec= JSON.parse(data), les données s'affichent correctement.

ce que j'essaie de réaliser, c'est simplement que mon mobile jquery s'exécute comme tel

<div data-role="main"  class="ui-content">
         <ul data-role="listview" id="list" >

            <li><a href="#">22 Jump Street</a></li>
            <li><a href="#">27 Dresses</a></li>

         </ul >
</div>
Jan

Vous devez supprimer les guillemets de vos appels appendChild, sinon vous passez une chaîne à cette fonction et elle ne sait pas comment gérer cela. Sans les guillemets, vous passez la référence d'objet à la fonction.

li.appendChild(a);
list.appendChild(li);

Articles connexes