如何数据库数据到前端

首先你需要掌握的是数据库查询语句，这里使用最简单的数据库查询语句：SELECT * FROM sys_role，表示从角色表中查询出所有的信息，下面展示的是查询结果，这个结果需要展示到前端页面则需要代码调用这个sql语句

请点击输入图片描述

在applicationContext.xml（spring mvc的配置文件）中配置数据库连接池，保证数据的正常连接，这里需要注意连接ip和数据库名称

请点击输入图片描述

首先在控制层（逻辑处理层）中调用后台查询函数，然后返回到页面，因为数据库可能比较大，所以需要使用分页工具，保证内存容量

请点击输入图片描述

业务逻辑层，一般情况下是实现接口的，这里是实现类，实现业务的分发，这里需要调用数据库Dao层的方法

请点击输入图片描述

最后在mybatis的配置文件中写入mybatis的查询语句，然后封装成方法，这里与最初的SELECT * FROM sys_role不同，主要是加了分页(limit)和排序功能(order by)

请点击输入图片描述

最后回到jsp页面，根据之前的控制层页面输出，我们需要写一个role.jsp的文件，该文件主要遍历查询出来的数据，遍历采用<c>标签的形式

请点击输入图片描述

7

最后使用前端页面框架就可以展示出像下面这样的前端样式展示

请点击输入图片描述

前端的JS 自身可能不能直接连数据库，后端的JS（如 Node.js ）是可以连数据库的；

如果你想前端JS 查数据库，可以用JS 发一个ajax 请后端，后端查询完数据库后，把结果封装成JSON 返回，前端的AJAX 回调函数中取出JSON 对象，把内容更新到网页上。

示例：

$.ajax({

   url: "./ajaxdata/findtable.do",

   method: 'POST',

   dataType: 'json',

   data: {

      dTyppe: 'findid',

      ID: '001',

   },

   success: function (data) {

         // data 是返回的对象，可以data 中取出数据        

         // 输出内容

      

   }

})

---