Сообщение об ошибке Не удалось выполнить appendChild на узле: параметр 1 не относится к типу узла

Question

Я пытаюсь заполнить свой мобильный список просмотра jquery, используя ajax, чтобы получить список названий фильмов, выполнив запрос php Mysql с данными в json.Я успешно получил данные в правильном формате json, однако в моем javascript я получаю сообщение об ошибке ... 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();


    };

когда я использую Google debug, я получаю свою ошибку на line-> li.appendChild ("a"), когда я нахожу указатель мыши на var vec = JSON.parse (data), данные отображаются правильно.

чтоЯ пытаюсь достичь просто для моего мобильного jquery для выполнения

<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>

Answer 1

Вы должны удалить кавычки из ваших вызовов appendChild, в противном случае вы передаете строку этой функции, и она не знает, как с этим обращаться. Без кавычек вы передаете объектную ссылку в функцию.

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