Ajax总结

最新推荐文章于 2024-11-02 12:42:04 发布
最新推荐文章于 2024-11-02 12:42:04 发布
阅读量378 收藏 1
点赞数
分类专栏： Ajax 前端 文章标签： ajax ajax跨域问题 javascript jquery node.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44934299/article/details/119059562
版权

Ajax总结

一、基本使用

示例：基本js文件

//1.引入express
const express = require('express');
//2.创建应用对象
const app = express();
//3.创建路由规则
app.get('/',(request,response)=>{
    response.send("Hello");
});
//4.启动监听器
app.listen(8000,()=>{
    console.log("stat!");
});

示例：服务启动方式

//1.安装nodejs；
//2.创建项目文件夹，使用vscode打开文件夹
//3.在vscode中建立js文件HTML文件和其他文件夹
//4.在最外侧文件夹打开运行终端，输入代码如下
npm init --yes
//5.引入express，代码如下
npm i -g express
//6.启动js服务
node 你建立的js文件名称.js

二、原生Ajax

1.Get请求

html代码如下（示例）：

<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <style>
            #result{
                width: 200px;
                height: 200px;
                border:solid 1px deeppink;
            }
        </style>
    </head>
    <body>
        <button>send</button>
        <div id="result"></div>
        <script>
            //获取butten元素
            const btn = document.getElementsByTagName("button")[0];
            const result = document.getElementById('result');
            //绑定事件
            btn.onclick = function(){
                //  console.log('test');
                //1.创建对象
                const xhr = new XMLHttpRequest();
                //2.初始化 设置请求方法和url
                xhr.open('GET','http://127.0.0.1:8000/server');
                //3.发送
                xhr.send();
                //4.事件绑定 处理服务返回结果
                xhr.onreadystatechange = function(){
                    //判断所有状态
                    if(xhr.readyState === 4){
                       //处理成功结果
                        if(xhr.status >= 200 && xhr.status < 300){
                            // console.log('success');
                            result.innerHTML = xhr.response;
                        }
                    }
                };
            }
        </script>
    </body>
</html>

js中添加代码如下（示例）：

const axios = require('axios');
app.get('/server',(request,response)=>{
    //响应头 设置允许跨域
    response.setHeader("Access-Control-Allow-Origin","*");
    //响应体
    response.send("Hello");
});

2.Post请求

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <style>
            #result{
                width: 200px;
                height: 200px;
                border:solid 1px deeppink;
            }
        </style>
    </head>
    <body>
        <div id="result"></div>
        <script>
            const result = document.getElementById('result');
            result.addEventListener("mouseover",function(){
                // console.log('success');
                //1.创建对象
                const xhr = new XMLHttpRequest();
                //2.初始化
                xhr.open('POST','http://127.0.0.1:8000/server1');
                //3.发送
                xhr.send();
                //4.处理
                xhr.onreadystatechange = function(){
                    if(xhr.readyState === 4){
                        if(xhr.status >= 200 && xhr.status < 300){
                            result.innerHTML = xhr.response;
                            
                        }
                    }
                }
            });
        </script>
    </body>
</html>

js中添加代码如下（示例）：

app.post('/server1',(request,response)=>{
    response.setHeader("Access-Control-Allow-Origin","*");
    response.send('Hello');
});

3.JSON转换

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <style>
            #result{
                width: 200px;
                height: 200px;
                border:solid 1px deeppink;
            }
        </style>
    </head>
    <body>
        <div id="result"></div>
        <script>
            const result = document.getElementById('result');
            window.onkeydown = function(){
                // console.log('test');
                const xhr = new XMLHttpRequest();
                xhr.responseType = 'json';
                xhr.open('GET','http://127.0.0.1:8000/json-server');
                xhr.send();
                xhr.onreadystatechange = function (){
                    if(xhr.readyState === 4){
                        if(xhr.status >= 200 && xhr.status < 300){
                            // console.log(xhr.response);
                            // result.innerHTML = xhr.response;
                            //手动转换JSON
                            // let data = JSON.parse(xhr.response);
                            // result.innerHTML = data.name;
                            // console.log(data);
                            //自动转换
                            result.innerHTML = xhr.response.name;
                            console.log(xhr.response);
                        }
                    }
                }
            };
        </script>
    </body>
</html>

js中添加代码如下（示例）：

app.all('/json-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    // response.send('Hello');
    const data = {
        'name':'lili'
    };
    let str = JSON.stringify(data);
    response.send(str);
});

4.IE缓存问题

IE浏览器在重复发送网页上某一个请求时，会优先从本地缓存中调取。
解决方法：

在XMLHttpRequest对象的open方法的url属性后拼接 +’/ie?’+Date.now()

5.请求超时处理

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <style>
            #result{
                width: 200px;
                height: 200px;
                border:solid 1px deeppink;
            }
        </style>
    </head>
    <body>
        <button>send</button>
        <div id="result"></div>
        <script>
            //获取butten元素
            const btn = document.getElementsByTagName("button")[0];
            const result = document.getElementById('result');
            //绑定事件
            btn.onclick = function(){
                //  console.log('test');
                //1.创建对象
                const xhr = new XMLHttpRequest();
                //超时设置 2s
                xhr.timeout = '2000';
                //超时回调
                xhr.ontimeout = function(){
                    alert('请求超时');
                };
                //网路异常处理
                xhr.onerror = function(){
                    alert('网络异常');
                };
                //2.初始化 设置请求方法和url
                xhr.open('GET','http://127.0.0.1:8000/overtime');
                //3.发送
                xhr.send();
                //4.事件绑定 处理服务返回结果
                xhr.onreadystatechange = function(){
                    //判断所有状态
                    if(xhr.readyState === 4){
                       //处理成功结果
                        if(xhr.status >= 200 && xhr.status < 300){
                            // console.log('success');
                            result.innerHTML = xhr.response;
                        }
                    }
                };
            }
        </script>
    </body>
</html>

js中添加代码如下（示例）：

app.get('/overtime',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    setTimeout(()=>{
        response.send('Hello')
    },3000);
});

6.取消请求

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <style>
            #result{
                width: 200px;
                height: 200px;
                border:solid 1px deeppink;
            }
        </style>
    </head>
    <body>
        <button>点击发送</button>
        <button>点击取消</button>
        <script>
            const btns = document.querySelectorAll('button');
            let xhr = null;
            btns[0].onclick = function(){ 
                xhr = new XMLHttpRequest();
                xhr.open('GET','http://127.0.0.1:8000/overtime');
                xhr.send();
            };
            btns[1].onclick = function(){
            	//取消请求
                xhr.abort();
            };
        </script>
    </body>
</html>

7.重复请求

多次重复请求会占用资源，我们只需要最新的请求即可

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <style>
            #result{
                width: 200px;
                height: 200px;
                border:solid 1px deeppink;
            }
        </style>
    </head>
    <body>
        <button>点击发送</button>
        <script>
            const btns = document.querySelectorAll('button');
            let xhr = null;
            //标志
            let flage = false;//是否正在发送ajax请求
            btns[0].onclick = function(){ 
                if(flage) xhr.abort();
                xhr = new XMLHttpRequest();
                flage = true;
                xhr.open('GET','http://127.0.0.1:8000/overtime');
                xhr.send();
                xhr.onreadystatechange = function(){
                    if(xhr.readyState === 4){
                        flage = false;
                    }
                };
            };
        </script>
    </body>
</html>

三、使用Jquery发送ajax请求

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        //引入bootstart模板
        <link crossorigin="anonymous" rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
        //引入jQuery
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"></script>
    </head>
    <body>
        <div class="container">
            <h2 class="page-header">JQuery发送AJAX请求</h2>
            <button class="btn btn-primary">GET</button>
            <button class="btn btn-danger">POST</button>
            <button class="btn btn-info">通用型方法ajax</button>
            <input type="text" class="form-control" disabled>
        </div>
        
        <script>
            $('button').eq(0).click(function(){
                $.get('http://127.0.0.1:8000/jquery-server',{a:100,b:200},function(data){
                    console.log(data);
                },'json');
            });
            $('button').eq(1).click(function(){
                $.post('http://127.0.0.1:8000/jquery-server',{a:100,b:200},function(data){
                    console.log(data);
                },'json');
            });
            $('button').eq(2).click(function(){
                $.ajax({
                    //url
                    url: 'http://127.0.0.1:8000/overtime',
                    //参数
                    data: {a:100,b:200},
                    //响应体类型
                    dataType: 'json',
                    //请求类型
                    type: 'GET',
                    //响应成功的回调
                    success: function(data){
                        console.log(data);
                    },
                    error: function(){
                        alert('别看了');
                    },
                    timeout: 2000
                });
            });
        </script>
    </body>
</html>

js中添加代码如下（示例）：

app.all('/jquery-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    // response.send('Hello');
    const data = {
        'name':'lili'
    };
    let str = JSON.stringify(data);
    response.send(str);
});

四、Axios发送Ajax请求

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <link crossorigin="anonymous" rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"></script>
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.js"></script>
    </head>
    <body>
            <button class="btn btn-primary">GET</button>
            <button class="btn btn-danger">POST</button>
            <button class="btn btn-info">ajax</button>
        <script>
            //公共url
            axios.defaults.baseURL= 'http://127.0.0.1:8000';
            const button = document.querySelectorAll('button');
            button[0].onclick = function(){
                axios.get('/axios-server', {
                    params: {
                        id:0
                    }
                })
                .then(function (response) {
                    console.log(response);
                })
                .catch(function (error) {
                })
            };
            button[1].onclick = function(){
                axios.post('/axios-server', {username:100,pass:200},{
                    params: {
                        id:0
                    }
                })
                .then(function (response) {
                    console.log(response);
                })
                .catch(function (error) {
                })
            };
            button[2].onclick = function(){
                axios({
                    method:'post',
                    url: '/axios-server',
                    data: {
                        id:'/axios-server'
                    },
                    params: {
                        a:100,
                        b:200
                    },
                    headers: {
                        h:100
                    },
                }).then((response)=>{
                    console.log(response);
                })
            };
        </script>
    </body>
</html>

js中添加代码如下（示例）：

app.all('/axios-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    response.send('Hello');
});

五、fetch函数发送Ajax请求

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
    </head>
    <body>
        <button>测试</button>
        <script>
            //获取butten元素
            const btn = document.getElementsByTagName("button")[0];
            btn.onclick = function(){
                fetch('http://127.0.0.1:8000/fetch-server',{
                    method: 'POST',
                    headers: {
                        a:100
                    },
                    body: 'a=100&b=200'
                }).then((res)=>{
                    // console.log(res);
                    return res.text();
                    // return res.json();
                }).then((res)=>{
                    console.log(res);
                });
            };
        </script>
    </body>
</html>

js中添加代码如下（示例）：

app.all('/fetch-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    response.send('Hello');
});

6、JSONP发送Ajax请求

1.非官方版JSONP

原理：获取自动生成的callback函数名，使用callback函数

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <link crossorigin="anonymous" rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"></script>
        <style>
            #result{
                width: 200px;
                height: 300px;
                border: solid 10px pink;
            }
        </style>
    </head>
    <body>
        <!-- <input type="button" name="获取" id="button" class="btn btn-primary"> -->
        <button class="btn btn-primary">获取</button>
        <div id="result"></div>
        <script>
            $('button').eq(0).click(function(){
                $.getJSON('http://127.0.0.1:8000/jquery-jsonp-server?callback=?',function(response){
                    $('#result').html(`
                    名称:${response.name}<br>
                    CODE:${response.code}
                    `);
                    console.log(response);
                });
            });
        </script>
    </body>
</html>

js中添加代码如下（示例）：

app.all('/jquery-jsonp-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    // response.send('Hello');
    const data = {
        name:'ll',
        code:['1','2','3']
    }
    let str = JSON.stringify(data);
    let callback = request.query.callback;
    // response.send(str);
    response.end(`${callback}(${str})`);
});

2.官方JSONP（cors）

html代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width"
        <title>测试</title>
        <link crossorigin="anonymous" rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
        <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"></script>
        <style>
            #result{
                width: 200px;
                height: 100px;
                border: solid 10px pink;
            }
        </style>
    </head>
    <body>
        <button class="btn btn-primary">获取</button>
        <div id="result"></div>
        <script>
            const btn = document.querySelector('button');
            const result = document.getElementById('result');
            btn.onclick = function(){
                const xhr = new XMLHttpRequest();
                xhr.open('get','http://127.0.0.1:8000/cors-server');
                xhr.send();
                xhr.onreadystatechange = ()=>{
                    if(xhr.readyState === 4){
                        if(xhr.status >= 200 && xhr.status < 300){
                            console.log(xhr.response);
                        }
                    }
                };
            };
        </script>
    </body>
</html>

js中添加代码如下（示例）：

app.all('/cors-server',(request,response)=>{
    //响应头 设置允许跨域
    response.setHeader("Access-Control-Allow-Origin","*");
    //响应体
    response.send("Hello");
});

完整server.js代码

//1.引入express
const express = require('express');
const axios = require('axios');
const { json } = require('express');
//2.创建应用对象
const app = express();
//3.创建路由规则
app.get('/server',(request,response)=>{
    //响应头 设置允许跨域
    response.setHeader("Access-Control-Allow-Origin","*");
    //响应体
    response.send("Hello");
});
app.post('/server1',(request,response)=>{
    response.setHeader("Access-Control-Allow-Origin","*");
    response.send('Hello');
});
app.all('/json-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    // response.send('Hello');
    const data = {
        'name':'lili'
    };
    let str = JSON.stringify(data);
    response.send(str);
});
app.get('/ie',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    response.send('IE');
});
app.get('/overtime',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    setTimeout(()=>{
        response.send('Hello')
    },3000);
});
app.all('/jquery-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    // response.send('Hello');
    const data = {
        'name':'lili'
    };
    let str = JSON.stringify(data);
    response.send(str);
});
app.all('/axios-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    response.send('Hello');
});
app.all('/fetch-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    response.send('Hello');
});
app.all('/jquery-jsonp-server',(request,response)=>{
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    // response.send('Hello');
    const data = {
        name:'ll',
        code:['1','2','3']
    }
    let str = JSON.stringify(data);
    let callback = request.query.callback;
    // response.send(str);
    response.end(`${callback}(${str})`);
});
app.all('/cors-server',(request,response)=>{
    //响应头 设置允许跨域
    response.setHeader("Access-Control-Allow-Origin","*");
    //响应体
    response.send("Hello");
});
//4.启动监听器
app.listen(8000,()=>{
    console.log("start!");
});
工k老虚
关注
专栏目录
AJAX 总结：ajax请求的几种方法。
小白的博客
07-24 3088
首先我们得知道AJAX是干嘛的，为什么要学习它把。 这里我看了一个博客，写的挺好。传送门：看这一篇就够了！-Ajax详解_Oriental_的博客-CSDN博客。 第二个重要的是 你要知道http协议中的请求报文和响应报文，要不学的一脸懵。 请求报文： 请求行，请求头，请求空行，请求体。 借一个博主文章讲一下请求报文。 第一行就是请求行，请求行中含有请求方法，请求URL，还有HTTP协议版本。 下面的圈4全部都是请求头，请求头是关键字/值对的形式。最下面的一行就是请求体，注意GET方法没.
php ajax实训心得1000字,新手必学的Ajax总结
weixin_33331639的博客
03-10 1055
这次给大家带来新手必学的Ajax总结，新手必学Ajax总结有哪些，下面就是实战案例，一起来看一下。一、Ajax简介、优劣势、应用场景以及技术Ajax简介 :Asynchronous Javascript And XML (异步的JavaScript和XML)它并不是一种单一的技术，而是有机利用一系列交互式网页应用相关的技术所形成的结合体AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器...
AJAX总结
Dragon_Z的博客
02-17 2677
ajax 全名 async javascript and XML(异步JavaScript和XML)是一种用于创建快速动态网页的技术是前后台交互的能⼒ 也就是我们客户端给服务端发送消息的⼯具，以及接受响应的⼯具AJAX 不是新的编程语言，而是一种使用现有标准的新方法。AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。是⼀个 默认异步执⾏机制的功能,AJAX分为同步（async = false）和异步（async = true）
ajax总结
m0_73728254的博客
08-12 883
AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步Javascript和XML”。即使用Javascript语言与服务器进行异步交互，传输的数据为XML（当然，传输的数据不只是XML）。AJAX还有一个最大的特点就是，当服务器响应时，不用刷新整个浏览器页面，而是可以局部刷新。这一特点给用户的感受是在不知不觉中完成请求和响应过程。Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。
Ajax用法总结
一只努力搬砖的打工妹纸
12-04 902
介绍ajax的使用方法
Django Ajax总结
huotong
06-09 1241
Matplotlib基础样式属性Ajax-Jqueryajax 配合 json使用BookStrap进行前端框架开发font-awesome 图标插件Ajax全套发送请求1.使用JQuery调用Ajax发送GET请求2.使用JS原生发送AjaxGet请求3.使用JQuery发送AjaxPOST请求4.适应JS原生代码发送AjaxPOST请求使用IFrame伪造Ajax请求iframe标签ifram...
ajax总结(三):ajax跨域访问接口方法汇总
庚中
11-13 6925
ajax跨域访问接口方法汇总 一.学习跨域之前先要了解: 1.同源和跨域的概念 a.同源:协议头、域名、端口全部一样就叫同源; b.跨域:只要协议头,域名,端口任意一个不一样就是跨域. 因为跨域的影响,导致浏览器出于安全角度考虑，不允许你用ajax（XMLHttpRequest）访问跨域的资源. 来一张图来说明: (如果使用了跨域,会报&amp;amp;amp;quot;No ‘Access-Control-Allow-Origi...
【Ajax】Ajax总结
凤凰涅槃
12-10 757
一、什么是Ajax： 允许浏览器与服务器通信而无须刷新当前页面的技术都被叫做Ajax（AsynchronousJavaScript and XML）。不用刷新整个页面便可与服务器通讯的办法。比如：高德地图就是不用刷新整个页面1.web的传统模型，客户端向服务器发送一个请求，服务器返回整个页面，如此反复 2.在Ajax模型中，数据在客户端与服务器之间独立传输，服务器不再返回整个页面 二、Ajax
ajax总结(四):原生js封装a和jQurey版ajax介绍
庚中
11-14 3210
一.为什么要封装? 发现很多地方都要用ajax请求，但是大部分代码都是一样的，所以根据封装的思想，相同的代码封装成函数，在需要用的地方来调用,这样很方便. 二.js封装ajax过程: 1.先了解结构代码和后台代码: 结构: 后台: 3.开始封装函数 //开始封装函数 function ajax(params){ /* * params.type:请求方式 * param...
JavaScript实现Ajax总结
12-03
**总结** Ajax的核心在于XMLHttpRequest对象的使用，通过它与服务器进行异步通信。虽然存在一些缺点，但在优化用户体验方面，Ajax依然是Web开发中的重要技术。理解并掌握Ajax的工作原理和实现方式，对于构建交互性强...
对AJAX总结记录 为什么要用ajax?
08-24
对AJAX总结记录 为什么要用ajax?
初学者必看的Ajax总结篇
10-20
Ajax全称为Asynchronous JavaScript and XML，是一种通过在后台与服务器交换少量数据即可实现网页动态更新的技术。它并不是一种新技术，而是利用现有的多种技术，包括HTML或XHTML、CSS、DOM、XML、XSLT、以及最重要...
ajax总结.doc
10-23
一些基础的ajax点，帮助大家在使用ajax的同时，能够更深入的了解和体验。有了Ajax之后，就可以实现在网页不跳转不刷新的情况下，在网页后台提交数据，部分更新页面内容。
AJAX和JSON
2401_85217463的博客
10-27 1107
JSON(JavaScript Object Notation，JavaScript 对象表示法)是一种基于字符串的轻量级的数据交换格式。易于人阅读和编写，同时也易于机器解析和生成。JSON 是 JavaScript 数据类型的子集。
React AJAX: Mastering Asynchronous JavaScript and XML in React Applications
lsx202406的博客
11-01 539
【代码】React AJAX: Mastering Asynchronous JavaScript and XML in React Applications。
ai说ajax
2301_78916954的博客
10-29 256
AJAX，全称为 Asynchronous JavaScript and XML，是一种用于在网页无需刷新整个页面的情况下，与服务器交换数据的技术。AJAX 使用 JavaScript 来执行异步 HTTP 请求，这些请求可以返回数据格式如 XML、JSON、HTML 或纯文本。这是一个术语，指的是一组 web 开发技术，它们被用来在无需刷新整个页面的情况下，通过异步方式与服务器交换数据。AJAX 的核心在于使用 JavaScript 来创建异步 HTTP 请求，并处理服务器的响应。
CesiumJS 案例 P12：添加指定长宽的图片图层并居中显示（圆点分别为图片图层的中心点、左上角顶点、右上角顶点、左下角顶点、右下角顶点）
weixin_52173250的博客
10-30 1121
CesiumJS 案例 P12：添加指定长宽的图片图层并居中显示（圆点分别为图片图层的中心点、左上角顶点、右上角顶点、左下角顶点、右下角顶点）
JavaScript 生成二维码
最新发布
qq_30049249的博客
11-02 89
我试过了，这一款js库支持中英文混合。进入网站后，可以直接点击运行哟～
Struts UI标签与AJAX技术总结
该资源是一份关于Struts学习的总结，特别强调了UI标签的使用，同时涵盖了AJAX的基础知识。 Struts是一个流行的Java Web开发框架，它简化了MVC（模型-视图-控制器）架构的实现。UI标签是Struts提供的用于构建用户...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

工k老虚

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值