Ajax中的Get请求

原创已于 2022-11-26 21:21:16 修改 · 3.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #前端 #javascript

于 2022-11-26 21:19:15 首次发布

本文详细解析了jQuery get()函数的用法，包括无参数和带参数请求的示例，以及参数的含义。通过实例了解如何发起GET请求并处理服务器响应。

get()函数的语法

get()函数的功能单一，专门用来发起get请求，从而将服务器上的资源请求到客户端来进行使用

get()函数的语法如下：

$.get(url, [data], [callback])

其中，三个参数各自代表的含义如下：

参数名	参数类型	是否必选	说明
url	string	是	要请求的资源地址
data	object	否	请求资源期间要携带的参数
callback	function	否	请求成功时的回调函数

get()发起不带参数的请求

使用get()函数发起不带参数的请求时，直接提供请求的URL地址和请求成功之后的回调函数即可

$.get('http://www.liulongbin.top:3006/api/getbooks',function(res) {
    console.log(res) //这里的res是服务器返回的数据
})

示例代码：

<!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>
    <script src="jquery.min.js"></script>  //引入jquery文件
    <style>
        
    </style>
</head>
<body>
    <button id="btnget">发起不带参数的URL请求</button>
    <script>
        $(function() {
            $('#btnget').on('click',function() {
                $.get('http://www.liulongbin.top:3006/api/getbooks',function(res) {
                    console.log(res);
                })
            })
        })
    </script>
</body>
</html>

get()发起带参数的请求

使用get()函数发起带参数的请求时,示例代码如下:

$.get('http://www.liulongbin.top:3006/api/getbooks', { id:1 }，function(res) {
    console.log(res)
})

第二个参数是一个参数对象