get请求和post请求(简单代码)

两种 HTTP 请求方法:GET 和 POST

在客户机和服务器之间进行请求-响应时,两种最常被用到的方法是:GET 和 POST。

  • GET - 从指定的资源请求数据。
  • POST - 向指定的资源提交要被处理的数据

url详解

1.url就是我们平常打开百度在地址栏输入的:https:www.baidu.com, 这个是最简单的url地址,打开的是百度的主页

2.那么一个完整的url地址,基本格式如下:

https://host:port/path?xxx=aaa&ooo=bbb

--http/https:这个是协议类型,如图中1所示

--host:服务器的IP地址或者域名,如图中2所示

--port:HTTP服务器的默认端口是80,这种情况下端口号可以省略。

如果使用了别的端口,必须指明,例如:192.168.3.111:8080,这里的8080就是端口

--path:访问资源的路径,如图中3所示/s (图中3是把path和请求参数放一起了)

--?:url里面的?这个符号是个分割线,用来区分问号前面的是path,问号后面的是参数

--url-params:问号后面的是请求参数,格式:xxx=aaa,如图4区域就是请求参数

--&:多个参数用&符号连接

 

get请求代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button onclick="sendMsg()">发送get请求</button>
    <div></div>
    <script>
        function sendMsg(){
            //创建一个对象
            var xhr=new XMLHttpRequest()
            //打开与后台的连接,open的参数
            //1请求的method
            //2请求的url
            //3是否异步,默认true,一般可以不写
            //携带参数加/id=1
            xhr.open('get','./data.php')
            //发送请求
            xhr.send()
            //监听状态的改变
            xhr.onreadystatechange=function(){
                //判断状态值的0-4 五种状态,4代表完成
                if(xhr.readyState===4){
                    //判断该状态码
                    if(xhr.status===200){
                        //收到字符串解析
                        var resp=JSON.parse(xhr.responseText)
                        console.log(resp)
                        //console.log(xhr.responseText)
                        document.querySelector('div').innerHTML=`
                        <h2>编号:${resp.id}</h2>
                        <h2>标题:${resp.title}</h2>

                        `
                        
                        
                    }
                }

            }

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

其中的php文件

<?php
$id=$_GET['id'];
$title=$_GET['title'];

echo json_encode(array(
    'id'=>123,
    'title'=>123,
    'age'=>20
));
?>

发送get请求以后的界面

//post请求详细代码

 

 

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值