案例:用ajax get方法 查询用户列表
html文件
<body>
<div id="d1"></div>
<button onclick="getlist()">获取用户列表</button>
<table id="content" border="1px">
<thead>
<td>uid</td>
<td>uname</td>
<td>upwd</td>
<td>email</td>
<td>phone</td>
<td>avatar</td>
<td>user_name</td>
<td>gender</td>
</thead>
</table>
<script>
function getlist(){
//创建异步对象
var xhr=new XMLHttpRequest();
//监听获取响应
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){
var result=xhr.responseText;
//得到响应数据,使用dom把结果放进div
var arr=JSON.parse(result);
console.log(arr);
for(var i=0;i<arr.length;i++){
content.innerHTML+=`
<tr>
<td>${arr[i].uid}</td>
<td>${arr[i].uname}</td>
<td>${arr[i].upwd}</td>
<td>${arr[i].email}</td>
<td>${arr[i].phone}</td>
<td>${arr[i].avatar}</td>
<td>${arr[i].user_name}</td>
<td>${arr[i].gender}</td>
</tr>
`;};
};
};
//打开连接 创建请求
xhr.open("get","http://127.0.0.1:8080/ajax/userlist",true);
//发送请求
xhr.send();
};
</script>
案例:用ajax get方法 查询用户列表的更多相关文章
- 使用mybatis提供的各种标签方法实现动态拼接Sql。这里演示where标签和if标签实现使用姓名的模糊查询和性别查询用户列表,当用户没有选择姓名以及性别时查询出所有的记录。
1.需求: 使用姓名的模糊查询和性别查询用户列表,当用户没有选择姓名以及性别时查询出所有的记录. 2.在UserMapper接口中定义方法: public List<User> findU ...
- 【Java框架型项目从入门到装逼】第十四节 查询用户列表展现到页面
这一节,我们来实现一下用户列表搜索,最终的效果如下: 这边我们要使用easyUI给我们提供的datagrid组件. HTML结构如下 <!-- 数据列表 --> <table id= ...
- ajax实现模糊查询完成列表信息显示
之前遗留一个老问题:列表模糊查询,用的直接是form提交,点击搜索按扭后,页面刷新,搜索框中关键词就没了,这鸡肋的体验,我发誓一定要搞定它 但是鉴于自己写代码是纯粹玩票,我写代码没有目标,只有在当前工 ...
- SQL Server中查询用户的对象权限和角色的方法
--SQL Server中查询用户的对象权限和角色的方法 -- 查询用户的object权限 exec sp_helprotect NULL, 'sa' -- 查询用户拥有的role exec sp_h ...
- 项目一:第十三天 1、菜单数据管理 2、权限数据管理 3、角色数据管理 4、用户数据管理 5、在realm中动态查询用户权限,角色 6、Shiro中整合ehcache缓存权限数据
1 课程计划 菜单数据管理 权限数据管理 角色数据管理 用户数据管理 在realm中动态查询用户权限,角色 Shiro中整合ehcache缓存权限数据 2 菜单数据添加 2.1 使用c ...
- 05Mybatis_入门程序——根据id查询用户
这篇文章我们来做一个入门的案例: 建表: /* SQLyog v10.2 MySQL - 5.1.72-community : Database - mybatis ***************** ...
- JPA默认方法查询遇到转JSON的处理
JPA提供的findAll等查询方法在有关联的对象时 比如:在查userInfo @Entity@Table(name = "user_info")public class Use ...
- 使用mybatis开发Dao的原始方法,实现根据用户id查询一个用户信息 、根据用户名称模糊查询用户信息列表 、添加用户信息等功能
1.需求 将下边的功能实现Dao: 根据用户id查询一个用户信息 根据用户名称模糊查询用户信息列表 添加用户信息 2. 原始Dao开发方法需要程序员编写Dao接口和Dao实现类 3.User.xml映 ...
- 零基础学习java------34---------登录案例,域,jsp(不太懂),查询商品列表案例(jstl标签)
一. 简单登录案例 流程图: 项目结构图 前端代码: <!DOCTYPE html> <html> <head> <meta charset="UT ...
- angularJS 条件查询 品优购条件查询品牌(条件查询和列表展示公用方法解决思路 及 post请求混合参数提交方式)
Brand.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &l ...
随机推荐
- C语言整人关机程序
#include <stdio.h> #include <stdlib.h> #include <string.h> int main() { char input ...
- GlusterFS常用维护操作命令
GlusterFS常用维护操作命令 1.启动/关闭/查看glusterd服务 # /etc/init.d/glusterd start # /etc/init.d/glusterd stop # /e ...
- ahk精简自用
;9:03 2022/8/20 自用 #NoEnv #Warn #SingleInstance Force ;设工作目录为桌面 SetWorkingDir %A_Desktop% ;托盘提示必须放在热 ...
- Spring boot pom 配置文件
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://mave ...
- Git创建、diff代码、回退版本、撤回代码,学废了吗
.eye-care { background-color: rgba(199, 237, 204, 1); padding: 10px } .head-box { display: flex } .t ...
- 安卓APP和小程序渗透测试技巧总结
安卓APP和小程序渗透测试技巧总结 免责声明: 安卓7以上抓取https流量包 证书信任 首先安装OpenSSL,此步骤不再赘述,可以参考百度. 然后安装模拟器(我使用的是夜神模拟器). 导出需要的证 ...
- mindxdl--common--log_record.go
// Copyright (c) 2021. Huawei Technologies Co., Ltd. All rights reserved.// Package common define co ...
- PHY驱动调试之 --- PHY控制器驱动(二)
1. 前言 内核版本:linux 4.9.225,以freescale为例. 2. 概述 PHY芯片为OSI的最底层-物理层(Physical Layer),通过MII/GMII/RMII/SGMII ...
- 使用 Bytebase 管理 Rainbond 上的应用数据库
在应用的发布过程中数据库的结构变更一直是最复杂也是风险最大的环节,而 Bytebase 可以对这一过程进行全生命周期的管理.在 Rainbond 中安装 Bytebase,轻松管理部署在 Rainbo ...
- 写一个frida通杀脚本
1. 前言 过年对我来说和平常没什么区别,该干什么干什么. 之前没接触过 frida 这个工具,前几天用了一些时间学习了一下,相比于 xposed hook 框架,frida 相对于调试方面真的很方便 ...