html获取简单json数据-后台PHP

来源:互联网 发布:matlab 2016 mac 破解 编辑:程序博客网 时间:2024/05/29 18:08

1.先写PHP,代码如下:

<?phpheader('Content-type:application/json;charset=utf-8'); $json='{        "id": "1",        "name": "姓名",        "show": "内容",        "mp3_path": "目录"        }';echo $json;?>

注意:设置请求头为json数据,字符编码utf-8,中间是分号。
在PHP中变量前用$符号。
2.在html引入jquery发起ajax请求,代码如下:

<!DOCTYPE html><html lang="zh-cn"><head>    <meta charset="utf-8">    <title>Javascript</title>    //引入jquery的CDN    <script   src="https://code.jquery.com/jquery-3.2.1.js"   integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE="   crossorigin="anonymous"></script></head><body><div id="div1">    <ul></ul></div><script>      var html="";      $.ajax({        type: "get",        url: "test01.php",        success: function (data)        {           //for in遍历php返回的json数据            for(var k in data)            {                 //用模板字符串将key value,拼接到html字符串中。                   html+=`<li>${k} :${data[k]}</li>`            }            $("#div1 ul").html(html);        },        error:function () {            alert("1111");        }    });</script></body></html>

3.注意:php文件和html文件应该位于同一目录,否则会存在跨域问题。
4.我是将这两个文件放在xampp下的htdocs目录。
5.打开文件可以看到输出如下。
输出内容