JS—我的第六个AJAX程序(前端从数据库中获取数据库中数据,JSON传输)

来源:互联网 发布:dnf优化后盒子无法换装 编辑:程序博客网 时间:2024/06/07 08:03

前端:

common.js

function $(id) {return document.getElementById(id);}function createXhr(){var xhr;if(window.XMLHttpRequest){xhr = new XMLHttpRequest();}else{xhr = new ActiveXObject("Microsoft XMLHttp");}return xhr;}
index.html

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><script src="common.js"></script></head><body><button onclick="getMsg()">显示数据</button><script>function getMsg(){var xhr = createXhr();xhr.open("get","users.php",true);xhr.onreadystatechange = function() {if(xhr.readyState == 4 && xhr.status == 200){var resText = xhr.responseText;var arr = JSON.parse(resText);for(var i in arr){console.log("编号:"+arr[i].uid);console.log("用户姓名:"+arr[i].uname);console.log("电子邮件:"+arr[i].email);console.log("联系方式:"+arr[i].phone);}}}xhr.send(null);}</script></body></html>
后台:

init.php

<?php $conn = mysqli_connect("127.0.0.1","root","","xz",3306);$initsql = "SET NAMES UTF8";mysqli_query($conn,$initsql);?>
users.php

<?php header("Content-Type:application/json");require("init.php");$sql = "SELECT * FROM xz_user";$result = mysqli_query($conn,$sql);if($result === false){echo null;}else{$count = mysqli_affected_rows($conn);if($count == 0){echo 0;}else{$arr = mysqli_fetch_all($result,1);$arr = json_encode($arr);echo $arr;}}?>





阅读全文
0 0
原创粉丝点击