JavaScript: Anhänge Kind mit Stil und Schleife

Question

ich folgend erreichen müssen:

<ul data-role="listview"> 
<li data-icon="false"> 
<!--loop content here--> 
</li> 
</ul> 

mit Hilfe von JavaScript. Ich denke, append Kind würde den Trick tun. Können Sie mir sagen, wie man appendchild verwendet, um dieses Ergebnis zu erzielen? Ich habe versucht, die folgenden:

$(document).ready(function() { 
$(document).bind('deviceready', function() { 
    //Phonegap ready 
    onDeviceReady(); 
}); 


//var output = document.getElementById("output"); 
var _ul = document.createElement('ul'); 
var _li= document.createElement('li'); 
_ul.setAttribute("data-role", "listview"); 
_li.setAttribute("data-icon", "false"); 

$.ajax({ 
    url: 'json_encoded_db.php', 
    dataType: 'jsonp', 
    jsonp: 'jsoncallback', 
    timeout: 5000, 
    success: function(data, status){ 
     $.each(data, function(i,item) { 

      _li.innerHTML = 
      '<a href="" id="'+item.id+'">'+ 
      '<img src="images/'+item.img+'">'+ 
      '</a>'; 

      _ul.appendChild(_li.cloneNode(true)); 
     }); 

    }, 
    error: function(){ 
     output.text('There was an error loading the data.'); 
    } 
}); 
document.getElementById("output").appendChild(_ul); 
}); 

aber es funktioniert nicht, ich meine, es ist eine Liste ohne Stil und anscheinend keine Daten-Rolle Eigenschaften bekommt. (natürlich funktioniert es um Daten aus der Datenbank zu bekommen, ich habe es getestet).

Answer 1

Verschieben Sie diesen Code in Ihrem $ .each() Ihres successCallback. So Ihre $ .each() wird wie folgt aussehen:

$.each(data, function(i,item) { 
    var _li= document.createElement('li'); 
    _li.setAttribute("data-icon", "false"); 
    _li.innerHTML = 
     '<a href="" id="'+item.id+'">'+ 
     '<img src="images/'+item.img+'">'+ 
     '</a>'; 

     _ul.appendChild(_li); 
}); 

auch des Klonens loszuwerden ‚_li‘