The data format of the page that the HTML page needs to add
<ul class= "Mui-table-view" id= "Oa_task_1" >
<li class= "Mui-table-view-cell" >
<div class= "Mui-slider-right mui-disabled" >
<a class= "mui-btn mui-btn-bule" > Corporate contacts </a>
<a class= "mui-btn mui-btn-red" > Remove </a>
</div>
<div class= "Mui-slider-handle" >
<div class= "Mui-media-body" >
<div class= "mui-pull-left mui-ellipsis pl-name" > Meng Meng's Day group Meng Meng's Day Regiment Meng Meng's Day group, the regiment of the day </div>
<p class= "Mui-pull-left pl-bule" > Corporate contacts </p>
</div>
<div class= "Mui-media-body" >
<p class= "Mui-pull-left" >2016 January 5 </p>
</div>
</div>
</li>
<li class= "Mui-table-view-cell" >
<div class= "Mui-slider-right mui-disabled" >
<a class= "mui-btn mui-btn-col" > Corporate contacts </a>
<a class= "mui-btn mui-btn-red" > Remove </a>
</div>
<div class= "Mui-slider-handle" >
<div class= "Mui-media-body" >
<div class= "Mui-pull-left mui-ellipsis pl-name" >T-ARA</div>
</div>
<div class= "Mui-media-body" >
<p class= "Mui-pull-left" >2016 January 5 </p>
</div>
</div>
</li>
</ul>
JS Code
Mui.ajax (url,{
data:{
Userid:userid,
type: ' 1 '
},
dataType: ' json ',//server returns JSON format data
Type : ' Post ',//http request type
timeout:10000,//Timeout Time is set to 10 seconds;
success:function (data) {
//Server return response, based on the response results, analysis whether the login success;
var result = eval (data);
result = eval (result);
if (result!=null) {
var x = 0;
var value = Result[0].value;
var hcount = result[0].count;
var appsize = result[0].appsize;
mui (' #pullrefresh '). Pullrefresh (). Endpulluptorefresh ((++count > Value));//The parameter is true to indicate that there is no more data.
var table = Document.body.querySelector ('. Mui-table-view ');
var cells = Document.body.querySelectorAll ('. Mui-table-view-cell ');
if (Hcount > Cells.length) {
for (var i = cells.length, Len = i + appsize; i < Len; i++) {
var li = document.createelement (' li ');
li.classname = ' Mui-table-view-cell ';
/*var contacts = result[0].page[i].contacts*/
/*console.log (result[0].page[0].contacts) */
var contacts=result[0].page[i].contacts
var contact;
var Divp;
if (contacts==1)
contact = "<a id=" +result[0].page[i].id+ "class= ' mui-btn mui-btn-bule ' > Corporate contacts </a>"
if (contacts==0)
contact = "<a id=" +result[0].page[i].id+ "class= ' mui-btn mui-btn-col ' > Corporate contacts </a>"
if (contacts==1)
divp= "<p class= ' mui-pull-left pl-bule ' > Corporate contacts </p>"
if (contacts==0)
divp= ""
li.innerhtml = ' <div class= ' mui-slider-right mui-disabled ' id= ' > ' +contact+ ' <a id= ' ' +result[0].page[i '. Id+ ' "class=" mui-btn mui-btn-red "> Remove </a></div><div class=" Mui-slider-handle "><div class=" Mui-media-body "> <div class= "Mui-pull-left mui-ellipsis pl-name" > ' +result[0].page[i].nickname+ ' </div> ' +divp+ ' </div ><div class= "Mui-media-body" ><p class= "Mui-pull-left" > ' +result[0].page[i].updatetime+ ' </p> </div></div> '
Table.appendchild (LI);
}
}
}
},
error:function (xhr,type,errorthrown) {
//exception handling;
Console.log ("No network of ~~~~~~ or server broken ~ ~");
}
});
MUI H5 JS dynamically adds different types of data