首先要引入JQ

    <script crossorigin="anonymous" src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>

服務(wù)端代碼

// 服務(wù)端準(zhǔn)備
// 1、引入express
const express = require('express');
// 2、創(chuàng)建應(yīng)用對象
const app = express()
// 3、創(chuàng)建路由規(guī)則
// request是對請求的封裝
// response是對響應(yīng)的封裝
app.all('/server',(request,response)=>{
    // 設(shè)置響應(yīng)頭：設(shè)置運行跨域
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    // 第一步：設(shè)置發(fā)給客戶端的JSON格式數(shù)據(jù)
    var data={
        code:200,
        msg:"成功"
    }
    // 第二步：由于response.send()只能發(fā)送字符串,所以要把JSON轉(zhuǎn)換成字符串
    data = JSON.stringify(data)
    // 第三步：發(fā)送數(shù)據(jù)
    response.send(data);
});
// 4、監(jiān)聽端口的啟動服務(wù)
app.listen(8000,()=>{
    console.log("服務(wù)已啟動,8000端口監(jiān)聽中...");
})

// 5、啟動服務(wù),終端輸入: node server.js基本使用.js ,啟動之后在瀏覽器輸入127.0.0.1:8000

客戶端代碼

格式1:?$.get/post(發(fā)送地址, 發(fā)送參數(shù){key:value,key:value...} 回調(diào)函數(shù)(function(data){}[data:響應(yīng)體]))

    $.get('http://127.0.0.1:8000/server', { a: 100, b: 200 }, function (data) {
        console.log(data);
    }); 

運行結(jié)果

?獲取的響應(yīng)是字符串，如何把字符串變成JSON對象

方法一：JSON.parse(data)

方法二：設(shè)置響應(yīng)數(shù)據(jù)類型為json格式

// $.get/post(發(fā)送地址, 發(fā)送參數(shù){key:value,key:value...} 回調(diào)函數(shù)(function(data){}[data:響應(yīng)體]),,'json)

? ? $.get('http://127.0.0.1:8000/server', { a: 100, b: 200 }, function (data) {

? ? ? ? console.log(data);

? ? },'json');

運行結(jié)果

文章來源地址http://www.zghlxwxcb.cn/news/detail-541348.html

?格式2：? ? // $.ajax({url:發(fā)送地址,data:發(fā)送參數(shù),type:GET/POST(請求類型)， 回調(diào)函數(shù)(data:響應(yīng)體)})

<script>
    $.ajax({
                // 1、url
                url:'http://127.0.0.1:8000/server',
                // 2、參數(shù)
                data:{
                    a:100,
                    b:200
                },
                // 3、請求類型GET/POST
                type:'GET',
                // 4、成功的回調(diào)
                success:function(data){
                    console.log(data);
                },
                // 5、響應(yīng)體類型設(shè)置
                dataType:'json',
                // 失敗回調(diào)
                error:function(){
                    console.log('報錯');
                },
                // 超時時間設(shè)置
                timeout:2000,
                // 請求頭信息
                headers:{
                    c:300,
                    d:400
                }
            }) 
</script>

到了這里，關(guān)于【AJAX】使用JQ發(fā)送AJAX發(fā)送請求的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！