ajax发送get请求

最新推荐文章于 2024-02-23 11:46:43 发布

天马行空zqzq

最新推荐文章于 2024-02-23 11:46:43 发布

阅读量311

点赞数

本文链接：https://blog.csdn.net/qq_42039912/article/details/105496930

版权

ajax-get.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<ul id="ull"></ul>
    <script>
        //先获取ul
        var $ull=document.getElementById('ull');
        var xhr=new XMLHttpRequest();
        xhr.open('GET','users.php');
        xhr.send();
        xhr.onreadystatechange=function(){
            if(this.readyState!==4) return;
            //先把数据转换成json格式.json里面存的是对象，可以对象点属性表示属性的值
            var data=JSON.parse(this.responseText);
            for(var i=0;i<data.length;i++){
                var $li=document.createElement("li");
                $li.id=data[i].id;
                $ull.appendChild($li);
                $li.innerHTML=data[i].name;
                //注册点击事件：
                $li.onclick=function(){
                    var xhr1=new XMLHttpRequest();
                    xhr1.open('GET','users.php?id='+this.id);
                    xhr1.send();
                    xhr1.onreadystatechange=function(){
                        if(this.readyState!==4) return;
                        var data1=this.responseText;
                        //把它转换成json数据格式，方便用对象点属性
                        var data2=JSON.parse(data1);
                        alert(data2.age);                       
                    }
                }
            }
        }

    </script>
</body>
</html>

users.php

<?php 

$data=array(
    array(
        'id'=>1,
        'name'=>'张三',
        'age'=>34
        ),
    array(
        'id'=>2,
        'name'=>'张三1',
        'age'=>56
        ),
    array(
        'id'=>3,
        'name'=>'张三2',
        'age'=>18
        ),
    array(
        'id'=>4,
        'name'=>'张三3',
        'age'=14
        )
    );
    if(empty($_GET['id'])){
        //如果没有传入id，遍历所有的id
        //现将数据转换成json格式,因为http约定的保温的内容为字符串
        $json=json_encode($data);
        echo $json;
    }else{
        //只传递了一条数据
        //早出id为接收值的那个数据
        foreach ($data as $items) {
            # code...
            if($items['id']==$_GET['id']){
               $json=json_encode($items);
                echo $json; 
            }
        }
    }
 ?>

天马行空zqzq

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax发送get请求

ajax-get.html<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body><ul id="ull"></ul...
复制链接

扫一扫