layui use data tables

    // first instance 
table.render ({ 
    elem: '#demo' 
    , height: 400 
    , URL: '/ My_NewsTest / LookServlet' // data interface 
    , Page: to true  // open tabs 
  , limit:. 5 
  , Limits: [ 3,6,10 ] 
  , Page: to true 
  , parseData: function (RES) { // RES is the original data returned 
        return {
             "code": 0, // parse interface status 
            "MSG": "", // parse Tip text 
            "COUNT": res.lmit, // parse data length 
            "data": res.arr //Analytical data list 
          }; 
        } 
    , cols: [[ // Header 
      {Field: 'ID', title: 'ID', Sort: to true , width: 80, Fixed: 'left', align = left: 'Center' ,} 
      , {Field: 'info', title: 'info', width: 80, align = left: 'Center' } 
      , {Field: '', title: 'operation', width: 400, height: 100, align: 'center', Toolbar: "the demo1 #" } 
    ]] 
  }); 
  

});

 

Introduced layui.css layui.js

Using a modular loading effect as FIG.