JS组装 HTML片段 列表 ul li

一 组装 列表

 

el = document.getElementById('requestlist'); 
 //var url = '/ServiceAction/com.eweaver.webservice.servlet.MListAction?action='+listtype+'&status='+liststate+'&pageno='+page+'&id='+user;

 $.ajax({
       type : "get",
       dataType : "JSON",
       url: '/ServiceAction/com.eweaver.webservice.servlet.MListAction?action='+listtype+'&status='+liststate+'&pageno='+page+'&id='+user,

         success : function(data){

             if(data.length>0){ //
   
      $.each(data,function(i,n){        
           li = document.createElement('li');
           var a = document.createElement('a');
           a.setAttribute('href','/m/workflow/workflowtest.jsp?workflowid='+n.WORKFLOWID+'&requestid='+n.ID+'&listtype=' + listtype+'&status='+liststate);
           a.setAttribute('data-ajax','false');
           a.innerHTML = n.WORKFLOWNAME ;
           li.appendChild(a);      
           str ='<div class="ui-grid-a"><div class="ui-block-a">'+'当前节点:'+n.CURRENTNODENAME+'</div>';
           str =str + '<div class="ui-block-b">'+'创建者:'+'sysadmin'+'</div></div>';
           li.innerHTML= li.innerHTML+str;
           li.setAttribute('style','height:60px');
           el.appendChild(li, el.childNodes[0]);
      });

            }else{
             //隐藏下一页按钮
             document.getElementById("nextpage").style.display="none"; 
             }

          },

       error : function(){
           // alert("1111");
       }

   });

 

 

二 纯HTML组装ul  li

 

function newRequestListAjax(user){
     var newNode  = document.createElement('div');
     newNode.setAttribute('id','newNode');
     newNode.setAttribute('data-role','collapsible-set');
     var str='';
  
     var wholepage = document.getElementById('wholepage');
     
     var url =  '/ServiceAction/com.eweaver.webservice.servlet.MListAction?action=newrequestlist&id='+user;

  $.ajax({
         type : "get",
         dataType : "JSON",
         url: url,
        
      success : function(data){
 
             if(data.length>0){
              $.each(data,function(name, value){  
               
               $.each(value,function(name, value){  
                
               str=  str+ '<div data-role="collapsible">';
               str = str+ '<h4>'+ name+'</h4> <ul data-role="listview">';
              
               $.each(value,function(i,n){
                str = str+ '<li><a  data-ajax="false" href= "/m/workflow/workflowtest.jsp?workflowid='+ n.WORKFLOWID+'">'+ n.WORKFLOWNAME+'</a></li>';
                
               });
               
               str= str+'</ul></div>';
                
               
               });
             });
              
              newNode.innerHTML= str;
 
              wholepage.appendChild(newNode, wholepage.childNodes[0]);
              $("#pageonee").trigger("create");
              $('.newNode').trigger("create");
                 }else{
                  }
          },
       
       error : function(data){

          }
   
      });

 }