<!DOCTYPE html><html lang="zh"> ???<head> ???????<meta charset="UTF-8" /> ???????<meta name="viewport" content="width=device-width, initial-scale=1.0" /> ???????<meta http-equiv="X-UA-Compatible" content="ie=edge" /> ???????<script src="js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script> ???????<title>Document</title> ???</head> ???<body style="padding-top: 30px;"> ???????<button id="btnJson">JSON</button> ???????<table class="table"></table> ???????<script type="text/javascript"> ???????????$(function() { ???????????????$("#btnJson").click(function() { ???????????????????$.ajax({ ???????????????????????type: "get", ???????????????????????url: "json.php", ???????????????????????dataType: "json", ???????????????????????async: true, ???????????????????????success: function(data) { ???????????????????????????var item; ???????????????????????????$.each(data, function(i, result) { ???????????????????????????????item = "<tr><td>" + result[‘city‘] + "</td><td>" + result[‘phone‘] + "</td></tr>"; ???????????????????????????????$(‘.table‘).append(item); ???????????????????????????}); ???????????????????????} ???????????????????}); ???????????????}) ???????????}) ???????</script> ???</body></html>JSON.PHP
<?php ???$host = ‘127.0.0.1‘; ???$user = ‘root‘; ???$password = ‘‘; ???$database = ‘yiibaidb‘; ???$conn = new mysqli($host, $user, $password, $database); ???if (!$conn) { ???????die("数据库连接失败！" . $conn -> connect_error); ???} ???$sql = "SELECT * FROM `offices`"; ???$result = $conn -> query($sql); ???$arr = array(); ???if ($result -> num_rows > 0) { ???????while ($rows = $result -> fetch_assoc()) { ???????????$arr[] = $rows; ???????} ???} ???echo json_encode($arr); ???$conn -> close();?>Ajax取PHP JSON数据并显示
原文地址：https://www.cnblogs.com/win32pro/p/8359951.html