zoukankan      html  css  js  c++  java
  • 黑马在线教育项目---15-16、datatables插件

    黑马在线教育项目---15-16、datatables插件

    一、总结

    一句话总结:

    datatables插件也比较好用,引入好插件的js和css后,核心代码也就是插件的初始化,如果要修改配置可以百度

    1、datatables插件的两种形式?

    客户端分页方式、服务端分页方式(limit),区别在于前者是一次性从服务端获取数据

    客户端分页:优点是当数据量少的时候,其速度是比较快的,其所有的操作都在客户端完成;但是如果数据量大的话,则加载的时候会很慢。

    服务端分页:优点是当数据量大的时候,由于每次都是通过limit限制输出记录,所以其速度基本不受影响;但是如果数据量少的时候则服务器的压力相对较大。

    后期在做datatables分页的时候可以根据数据量来选择是使用客户端还是服务端分页。

    2、datatables插件核心操作?

    初始化DT插件:$(选择器).dataTable(); 就这一句

    二、使用datatables插件实现列表的无刷新分页

    Datatables插件是一款基于jQuery框架进行开发的无刷新分页插件,其除了分页还有排序、搜索等功能。

    官网:https://www.datatables.net/

    该分页插件有2种形式:客户端分页方式、服务端分页方式(limit

    客户端分页:优点是当数据量少的时候,其速度是比较快的,其所有的操作都在客户端完成;但是如果数据量大的话,则加载的时候会很慢。

    服务端分页:优点是当数据量大的时候,由于每次都是通过limit限制输出记录,所以其速度基本不受影响;但是如果数据量少的时候则服务器的压力相对较大。

     

    后期在做datatables分页的时候可以根据数据量来选择是使用客户端还是服务端分页。

    2.1、使用客户端分页方式实现分页

    使用步骤:

             ①先在确保引入jQuery之后,再去引入datatables的JavaScript文件;

             ②需要初始化datatables插件

             ③【可选】databtables支持一些扩展的配置

    ①引入对应的文件

    ②初始化DT插件

    语法:$(选择器).dataTable();

    ③【可选】针对当前的情况来进行一些配置

    a. 禁用掉第一列(复选框)排序

    b. 更改默认的初始化排序操作

    提示:后期需要用到这些配置项代码,不建议去记忆,用的时候直接百度搜索即可。

    实现效果:

     
  • 相关阅读:
    []Xcode中的iOS模拟器
    飞凌百套OK335xS-2开发平台免费申请
    FastDFS整合Nginx
    阿里云服务器Centos7安装FastDFS(一)
    进程调度
    Tomcat一
    SpringBoot初探
    Java中的日志框架
    JVM类加载之创建对象的过程
    JVM类加载机制二
  • 原文地址:https://www.cnblogs.com/Renyi-Fan/p/11610538.html
Copyright © 2011-2022 走看看