分享

jQuery请求json格式数据并渲染页面

 hncdman 2022-12-18 发布于湖南


分类专栏: jquery html 文章标签: jquery php html 前端


json格式的数据文件有两种方式

一种是xxx.json文件

一种是xxx.php文件

前者是json格式的文件

后者是输出json格式的文件

前者是本地的文件

前者是本地的文件

后者是获取数据库的数据在输出json格式的php文件

先说前者

例如有一个json格式的文件

data.json

[

{

'id':'001',

'title':'百度',

'url':'http://www.baidu.com'

},

{

'id':'002',

'title':'阿里',

'url':'www.alibaba.com'

},

{

'id':'003',

'title':'腾讯',

'url':'www.qq.com'

}

]



通过ajax.html获取数据

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>ajax请求json数据</title>

</head>

<div id="test"></div>

<script src="https://code./jquery-3.0.0min.js"></script>

<script>

$(function(){

$.ajax({

//请求方式

type:"GET",

//文件位置

url:"data.json",

//返回数据格式为json,也可以是其他格式如

dataType:"json",

//请求成功后要执行的函数,拼接html

success:function(data){

var atr="<ul>";

$.each(data,function(i, n){

var str="<li>"+"ID::"+n.id+"</li>";

str+="<li>"+"标题:"+n.title+"</li>";

str+="<li>"+"地址:"+n.url+"</li>";

});

str+="</ul>";

$("div").append(str);

}

});

});

</script>

</body>

</html>



html页面引入了

接下来就是后者了

后者就是直接从数据库获取数据,并且输出json格式的数据

例如命名为api.php

<?php

header("content-type:application/json");

//获取数据库配置

require_once("config.php");

//连接数据库

$con = mysql_connect($host,$username,$password);

if (!$con)

   {

   die('连接数据库失败,失败原因:'.mysql_error());

   }

//设置数据库字符集

mysql_query("SET NAMES UTF8");

//查询数据库

mysql_select_db($db,$con);

//获取最新的10条数据

$result = mysql_query("SELECT id,resname,imgurl,resint,resurl,pageview FROM $restb ORDER BY id DESC LIMIT 0,20");

$results = array();

while ($row = mysql_fetch_assoc($result)){

$results[]=$row;

}

//将数组转成json格式

echo json_encode($results);

//关闭连接

mysql_free_result($result);

mysql_close($link);

echo $json;

?>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

因为涉及到连接数据库,把数据地址、账号、密码、数据库名、表名都写到一个config.php里面直接在api.php引入

config.php

<?php

//配置文件 - BY TANKING

//下面是连接数据库主机、用户名、密码、数据库名、表名

$host="localhost";

$username="root";

$password="root";

$db="list";

$restb="reslist";

?>


访问api.php会直接跟前者一样,只是一个是在数据库获取,一个是在本地获取

————————————————

版权声明:本文为CSDN博主「python183360」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。

原文链接:https://blog.csdn.net/python183360/article/details/90182951

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多