AJAX总结

最新推荐文章于 2022-11-01 20:34:23 发布
最新推荐文章于 2022-11-01 20:34:23 发布
阅读量320 收藏 1
点赞数
分类专栏： javascript AJXA 文章标签： ajax javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42661167/article/details/107855266
版权

AJAX

说明：前五节是AJAX的一个基本介绍以及练习的工具。第六节介绍AJAX的发送请求方法以及遇到问题的处理

一、什么是AJAX

AJAX = 异步 JavaScript 和 XML，是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
优点：1.无需刷新页面与服务器进行通信。2.允许根据用户事件来更新部分页面内容。
缺点：1.没有浏览历史，不能回退。2.存在跨域问题(同源)。3.SEO不友好(不能爬虫)。.

二、什么是XML

XML是可拓展标记语言，用于传输和存储数据，XML与HTML类似，但是XML中没有预定义标签（div，ul，p标签等），而是使用自定义标签。HTML用于呈现数据
如：存储一个用户数据

name:"小红";age:18;sex:"女"
用XML表示：
<users>
	<name>小红</name>
	<age>18</age>
	<sex>女</sex>
</users>

传递方式：服务端将XML通过字符串的形式传递到客户端，客户端再用JS进行处理
在这里插入图片描述
目前被json取代

三、JSON

JSON相对于XML来讲，JSON对数据的描述性比XML差，但JSON数据体积小，传递速度更快，
与JavaScript交互更加方便，更容易解析处理，更好数据交互。
如：存储一个用户数据

{"name":"小红","age":18,"sex":"女"}

四、AJAX请求基本操作

在这里插入图片描述

五、Express框架

为了方便练习，搞一个服务端，express框架是基于node环境下的一个框架
1.安装

npm i express

2.创建服务端 server.js 文件

//1.引入 express
const express = require('express');
const { request } = require('express');

//2.创建应用对象
const app = express();

//3.创建路由规则
// request 是对请求报文的封装
// response 是对响应报文的封装
app.get('/',(request,response)=>{
  //设置响应
  response.send('HELLO EXPRESS');
});

// 4.监听端口启动服务
app.listen(8000,()=>{
  console.log("服务已经启动,8000 端口监听中.... ");
})

3.启动方式：node server.js
在这里插入图片描述

如果不想重复启动可以安装nodemon自动重启工具

npm install -g nodemon

启动方式：
nodemon server.js
之后ctrl s 就可以了

六、AJAX发送请求

1、POST、GET请求

POST

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>AJAX POST 请求</title>
  <!-- 需求：将鼠标放入框内时发送POST请求，将返回的数据显示到框内 -->
  <style>
    #result{
      width: 200px; 
      height: 100px;
      border: 1px solid #f55;
    }
  </style>
</head>

<body>
  <div id="result"></div>
  <script>
    // 获取元素对象
    const result = document.getElementById('result');
    // 绑定事件
    result.addEventListener('mouseover',function(){
      // console.log('test');
      // 1.创建对象
      const xhr = new XMLHttpRequest();
      // 2.初始化 设置类型与URL
      xhr.open('POST','http://127.0.0.1:8000/server');
      // 设置请求头
      xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
      xhr.setRequestHeader('name','atguigu')//自定义的请求头
      // 3.发送,设置请求体
      xhr.send('a=100&b=200&c=300');
      // xhr.send('a:100&b:200&c:300');
      // xhr.send('123456789');
      //4.事件绑定
      xhr.onreadystatechange = function(){
        //判断
        if(xhr.readyState === 4){
          if(xhr.status >= 200 && xhr.status < 300){
            //处理服务端返回的结果
            result.innerHTML = xhr.response;
          }
        }
      }
    });
  </script>
</body>
</html>

GET

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>AJAX GET 请求</title>
  <!-- 需求：点击发送请求，将服务端返回的数据渲染到result中 -->
  <style>
    #result{
      width: 200px;
      height: 100px;
      border: 1px solid #90b;
    }
  </style>
</head>
<body>
  <button>点击发送请求</button>
  <div id="result"></div>

  <script>
    //获取button元素
    const btn = document.getElementsByTagName('button')[0];
    const result = document.getElementById('result');
    //绑定事件
    btn.onclick = function(){
      // 1.创建对象
      const xhr = new XMLHttpRequest();
      // 2.初始化 设置请求方法和url
      // 设置URL方式：在末尾加 ?a=100&b=200&c=300
      xhr.open('GET','http://127.0.0.1:8000/server?a=100&b=200&c=300');
      // 3.发送
      xhr.send();
      // 4.事件绑定 处理服务器返回的结果
      // onreadystatechange 表示
        //  on           when 当...的时候
        //  readyState   是xhr对象中的属性，表示状态0 1 2 3 4
        //  change       改变
      xhr.onreadystatechange = function(){
          //判断(服务端返回了所有的结果)
        if(xhr.readyState === 4){
          // 判断响应状态码 200 404 403 401 500
          // 2xx 代表成功
          if(xhr.status >= 200 && xhr.status < 300){
            //处理结果    行  头  空行  体
            // 响应
            // console.log(xhr.status,'     状态码');//状态码
            // console.log(xhr.statusText,'    状态字符串');//状态字符串
            // console.log(xhr.getAllResponseHeaders(),'   所有响应头');//所有响应头
            // console.log(xhr.response,'    响应体');//响应体

            //设置 result 的文本
            result.innerHTML = xhr.response;
          }
        }
      }
    }
  </script>
</body>
</html>
2、AJAX对服务端响应JSON数据格式的转换

解决方法：
1.手动转换

let data = JSON.parse(xhr.response);
            console.log(data);
            result.innerHTML = data.name;

2.自动转换(先设置响应体数据类型)

      xhr.responseType = 'json';
      result.innerHTML = xhr.response.name;

server.js

//响应JSON数据
app.all('/json-server', (request, response) => {
  // 设置响应头   设置允许跨域
  response.setHeader('Access-Control-Allow-Origin', '*');
  // 响应头
  response.setHeader('Access-Control-Allow-Headers', '*');
  //响应一个数据
  const data = {
    name: 'atshsd',
  };
  //对对象进行字符串转换
  let str = JSON.stringify(data);
  // 设置响应体
  response.send(str);
});

AJAX

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>JSON响应</title>
  <!-- 需求：当鼠标按下或按下enter键，向服务端发送请求，将返回的结果显示到div盒子上
   -->
   <style>
     #result{
       width: 200px;
       height: 100px;
       border: 1px solid #f66;
     }
   </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;

            // 手动对数据转换
            // let data = JSON.parse(xhr.response);
            // console.log(data);
            // result.innerHTML = data.name;

            //自动转换:先设置响应体数据的类型
            // console.log(xhr.response);
            result.innerHTML = xhr.response.name;
          }
        }
      }

    } 
  </script>
</body>
</html>
3、解决IE缓存问题

当服务端数据发生改变时，在浏览器中刷新，IE浏览器不会同步更新服务端的数据
解决方法：在初始化请求方法中加入Date.now() 方法

 // 2.初始化设置请求方法
      xhr.open('GET','http://127.0.0.1:8000/ie?t='+Date.now());
4、请求超时和网络异常处理

当服务端数据长时间没有响应时，AJAX做处理
解决方法：1.timeout设置一个响应时间。2.ontimeout超时回调。3.onerror网络异常回调。
server.js

// 延时响应
app.get('/delay', (request, response) => {
  // 设置响应头   设置允许跨域
  response.setHeader('Access-Control-Allow-Origin', '*');
  setTimeout(() => {
    // 设置响应体
    response.send('延时响应');
  },3000);
});

AJAX

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>请求超时与网络异常</title>
    <style>
      #result {
        width: 200px;
        height: 100px;
        border: solid 1px #900;
      }
    </style>
  </head>
  <body>
    <button>点击发送请求</button>
    <div id="result"></div>
    <script>
      // 获取button元素
      const btn = document.getElementsByTagName('button')[0];
      const result = document.getElementById('result');
      //绑定事件
      btn.onclick = function () {
        // 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/delay');
        // 3.发送请求
        xhr.send();
        // 4.事件绑定 对服务端返回数据做处理
        xhr.onreadystatechange = function () {
          if (xhr.readyState === 4) {
            if (xhr.status >= 200 && xhr.status < 300) {
              result.innerHTML = xhr.response;
            }
          }
        };
      };
      btn.addEventListener;
    </script>
  </body>
</html>
5、取消请求

点击取消时，AJAX取消像服务端发送请求
解决方法：通过添加abort()方法
AJAX

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>AJAX取消请求</title>
  <!-- 需求：通过点击取消按钮，取消AJAX发送请求 -->
</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/delay');
      xhr.send();
    }
    // 取消请求 abort()方法
    btns[1].onclick = function(){
      xhr.abort();
    }
  </script>
</body>
</html>
6、解决重复请求问题

当用户疯狂点击某一个按钮向服务器发送请求时，会给服务器造成压力，所以需要将最新请求之前的请求全部取消
解决方法：创建一个值为false的标识变量。当发送请求时该变量为true；请求结束后，状态值为4，则该变量为false。再判断当变量为false时执行abort()方法。
AJAX

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>AJAX重复发送请求</title>
  <!-- 需求：用户在频繁点击发送按钮请求服务器时，将最新以外的请求全部取消掉 -->
</head>
<body>
  <button>点击发送</button>

  <script>
    const btns = document.querySelectorAll('button');
    let xhr = null;
    //创建一个标识变量
    let isSending = false
    // 发送请求
    btns[0].onclick = function(){
      if(isSending)xhr.abort();//如果isSending为false，则取消该请求
      xhr = new XMLHttpRequest();
      // 发送请求时标识变量值为true
      isSending = true;
      xhr.open('GET','http://127.0.0.1:8000/delay');
      xhr.send();
      xhr.onreadystatechange = function(){
        if(xhr.readyState === 4){
          // 请求结束后标识变量值为false
          isSending =false
        }
      };
    }
  </script>
</body>
</html>
7、jQuery方法发送AJAX请求

包含GET,POST,通用三种方法：
server.js

//jQuery 服务
app.all('/jquery-server', (request, response) => {
  response.setHeader('Access-Control-Allow-Origin', '*');
  response.setHeader('Access-Control-Allow-Headers','*');
  const data = {name:'小红'};
  response.send(JSON.stringify(data));
});

AJAX

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>jQuery 发送 AJAX请求</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
  <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.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">通用方法</button>
  </div>

  <script>
    /* 
        第一个参数：给谁发（http://127.0.0.1:8000/jquery-server）
        第二个参数：发送什么，是一个对象，{key:value}形式
        第三个参数：回调函数，其中的data是响应体
        第四个参数：响应体类型（常用的为json） 
    */
    $('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);
      })
    })
    $('button').eq(2).click(function(){
      $.ajax({
        //url
        url:'http://127.0.0.1:8000/jquery-server',
        //参数
        data:{a:100,b:200},
        //请求类型
        type:'GET',
        //响应体结果
        dataType:'json',
        //成功的回调
        success:function(data){
          console.log(data);
        },
        //超时时间
        timeout:2000,
        //失败的回调
        error:function(){
          console.log('出错');
        },
        //头信息
        headers:{
          c:200,
          d:300
        }
      })
    })
  </script>
</body>
</html>
8、axios发送AJAX请求

也包含GET、POST、通用方法
server.js

//axios 服务
app.all('/axios-server', (request, response) => {
  // 设置响应头   设置允许跨域
  response.setHeader('Access-Control-Allow-Origin', '*');
  // 响应头
  response.setHeader('Access-Control-Allow-Headers', '*');
  // 设置响应体
  const data = {name:'你好'};
  response.send(JSON.stringify(data));
});

ajax

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>axios 发送 AJAX请求</title>
    <script
      crossorigin="anonymous"
      src="https://cdn.bootcdn.net/ajax/libs/axios/0.20.0-0/axios.js"
    ></script>
  </head>
  <body>
    <button>GET</button>
    <button>POST</button>
    <button>通用方式</button>

    <script>
      const btns = document.querySelectorAll('button');

      //配置 baseURL
      axios.defaults.baseURL = 'http://127.0.0.1:8000';

        //GET 方法
      btns[0].onclick = function () {
        //请求类型
        axios
          .get('/axios-server', {
            //url 参数
            params: {
              id: 100,
              vip: 7,
            },
            //请求头信息
            headers: {
              name: 'sdasd',
              age: 20,
            },
          })
          .then((res) => {
            console.log(res);
          });
      };

      //POST方法
      btns[1].onclick = function () {
        //请求类型
        axios.post(
          '/axios-server',
          {
            username: 'admin',
            password: 'admin',
          },
          //url
          {
            params: {
              id: 200,
              vip: 9,
            },
            //请求头参数
            headers: {
              height: 100,
              weight: 180,
            },
          }
        );
      };

      // 通用方法
      btns[2].onclick = function () {
        axios({
          // 请求类型
          method: 'POST',
          // url
          url: '/axios-server',
          //url参数
          params: {
            vip: 10,
            level: 30,
          },
          //头信息
          headers: {
            a: 100,
            b: 100,
          },
          // 请求体参数
          data: {
            username: 'admin',
            password: 'admin',
          },
        }).then((res) => {
          // 响应结果
          console.log(res);
          // 响应状态码
          console.log(res.status);
          //响应状态字符串
          console.log(res.statusText);
          // 响应头信息
          console.log(res.headers);
          //响应体
          console.log(res.data);
        });
      };
    </script>
  </body>
</html>
9、fetch函数发送AJAX请求

server.js

//fetch 服务
app.all('/fetch-server', (request, response) => {
  // 设置响应头   设置允许跨域
  response.setHeader('Access-Control-Allow-Origin', '*');
  // 响应头
  response.setHeader('Access-Control-Allow-Headers', '*');
  // 设置响应体
  const data = {name:'你好'};
  response.send(JSON.stringify(data));
});

ajax

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>fetch 发送 AJAX请求</title>
</head>
<body>
  <button>AJAX请求</button>

  <script>
    const btn = document.querySelector('button');

    btn.onclick = function(){
      fetch('http://127.0.0.1:8000/fetch-server?vip=10',{
        //请求方法
        method:'POST',
        //请求头
        headers:{
          name:'sadadf'
        },
        //请求体
        body:'username=admin&password=admin'
      }).then(res=>{
        // return res.text();
        return res.json();
      }).then(res=>{
        console.log(res);
      })
    }
  </script>
</body>
</html>

以上对AJAX的总结是在b站上学习后进行的个人总结，有不足的地方希望大佬们多多指正 ，视频地址在下方 ：)
链接: link

四驱兄嘚
关注
专栏目录
Ajax
不变嘚＆code的博客
03-18 239
##AJAX## - 是什么?  - AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。 - 是一种创建交互式网页应用的网页开发技术 - 能干什么 - 浏览器后台与服务器进行少量的数据交互， AJAX可以使页面实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。 - 简单的说传统
js中手写ajax,AJAX总结（二），手写AJAX
weixin_36255718的博客
08-05 219
前言在前端面试的时候经常会有如下情景。AJAX会吗？能不能手写个AJAX？第一个问题可以参见我的另一篇博客，AJAX总结(一)，AJAX概述。这篇博文我们来回答第二个问题，手写AJAX。一、手写AJAX的步骤手写AJAX并没有一个固定的标准的答案，但是AJAX的关键步骤就那么几步，我会先用文字介绍关键步骤，然后给出两个版本的手写AJAX的代码及注释。帮助大家很好地理解和记忆。创建XMLHttpRe...
Ajax的4种错误处理
weixin_42321619的博客
08-19 2019
1.网络畅通，服务器端能接收到请求，服务器端返回的结果不是预期结果。（用户给服务器发送参数，参数不符合要求，所以服务器返回非200状态码） 可以判断服务器返回的状态码，分别进行处理。 xhr.status //获取http状态码 //路由 app.get('/error', (req, res) => { res.status(400).send('not ok') }) //页面 <body> <button id="btn">发送aa<
Ajax系列之错误处理
老__L的博客
11-01 1545
错误处理
ajax onerror code,Ajax请求'onError'处理程序
weixin_30884379的博客
08-06 472
我的网站上有一项功能：删除不刷新页面。用户只需按下'删除'，浏览器就会发送Ajax请求。它会用ID参数加载'delete'脚本。Ajax请求'onError'处理程序一切正常。但由于数据库的参照完整性，它不是很好。例如，有可能删除一些人居住的街道。我想升级我的脚本。我想添加一个检查来删除脚本，并且如果某些“人员”连接到“街道”表，则不要让删除数据。点击按钮的jQuery的处理程序：$('body'...
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.request onerror 后台 response,【浏览器模型】AJAX
weixin_35212962的博客
08-05 531
AJAX是一种浏览器跟服务器通信的技术，采用XMLHttpRequest原生接口对服务器发出指令。在原先的浏览器中，如果想要发出对服务器请求的指令那么只能通过form表单或者url栏，随着AJAX接口的出现，我们可以在用户浏览网页时通过某种指令就发出请求而不刷新网页，提高网页操作流畅度。现在AJAX已经成为js脚本发送请求的代名词。要注意的是，由于历史原因，AJAX中的X原来是代表XML，现在服务...
Ajax请求成功却执行error回调方法（Ajax跨域请求问题）
guqing's blog
01-04 3255
遇到的问题描述： Ajax使用post请求添加分组，请求url是RESTful风格。添加成功了已经向数据库写入了信息，但是Ajax却执行了error回调，观察网络发现有两次相同请求一次是get请求，一次是post请求携带了需要向数据库写入的参数。第一次请求成功返回200，第二次却返回404，所以导致回调进入了error。 于是乎查找了很久解决方案，明白了是跨域请求导致，而Ajax只能同源请求。 解...
了解Ajax
刘炳全的博客
09-09 141
一、背景和目的（传统网站中存在的问题） 网速慢的情况下，页面加载时间长，用户只能等待； 表单提交后，如果一项内容不合格，需要重新填写所有表单； 页面跳转，重新加载页面，造成资源浪费，增加用户等待时间。 二、应用场景 页面上拉加载更多数据； 列表数据无刷新验证； 表单项焦点数据验证； 索框提示文字下拉列表。 三、原生js Ajax请求的5个步骤 //1、创建 XMLHttpRequest 对象 var ajax = new XMLHttpRequest(); //2、规定请求的类型、URL 以
Ajax怎么处理错误
forljnlearning的博客
07-04 653
网络畅通，服务器端能接收到请求，服务器端返回的结果不是预期结果。 可以判断服务器端返回的状态码,分别进行处理。xhr.status获取http状态码 网络畅通, 服务器端没有接收到请求，返回404状态码。 检查请求地址是否错误。 网络畅通, 服务器端能接收到请求,服务器端返回500状态码。 //Ajax错误处理 app.get('/error',(req,res)=>{//要先改状态码再send res.status(400).send('hello'); }) var b.
jquery ajax onerror,javascript - catch jquery ajax error later - Stack Overflow
weixin_28965739的博客
08-06 243
I try to make an http request to a freebox ( I don't know if it's exist outside france )The freebox don't access the CORS request, but she make what I will.For example if I make a request for power :h...
ajax（6）——模拟网络连接超时和网络异常请求，ontimeout，onerror,
木子 旭的博客
02-28 887
1.代码 1.1服务代码 const express = require("express"); const app = express(); app.get("/server", (request, response) => { response.setHeader("Access-Control-Allow-Origin", "*"); const data = { name: "lixv000", }; let str = JSON.stringify(data);
javascript之处理Ajax错误
bboyjoe的博客
07-23 1872
使用Ajax须留心两类错误。它们的区别源于视角的不同。 第一类错误是从XMLHttpRequest对象的角度看到的问题：某些因素阻止了请求发送到服务器，例如DNS无法解析主机名，连接请求被拒绝，或者URL无效。 第二类错误是从应用程序的角度看到的问题：它们发生于请求成功发送至服务器，服务器接受请求，进行处理并生成响应，但该相应并不指向你期望的内容时。例如：如果你请求的URL不存在，这类问题就会
Ajax应用示例： XMLHttpRequest封装
一个情绪猿的脖克...
12-09 5723
XMLHttpRequest封装在HttpClient.js文件内，代码如下： function HttpClient(){} HttpClient.prototype={ //传给open方法的GET或者POST类型 requestType: 'GET',
原生JS的xhr方法返回responseText的问题
weixin_30781107的博客
09-13 2055
这一篇主要是记录作用，起因是昨天看到邮箱里有一封上周的邮件，被淹没在了一堆垃圾邮件里，哈哈。这封邮件是一家IT公司发来的面试题，最近是有在投简历找工作啦，不过一般都是电话先聊聊，然后再约上门的，直接上邮件的，我还是第一次见。 邮件的内容大概就是：我们的需求是xxxxxxx，交互接口ajax是xxxxxx，xxxx,要做单手机版页面，请完成后将文件发回到此邮箱，如果满意的话会再邮箱通知。 本来我...
Struts UI标签与AJAX技术总结
该资源是一份关于Struts学习的总结，特别强调了UI标签的使用，同时涵盖了AJAX的基础知识。 Struts是一个流行的Java Web开发框架，它简化了MVC（模型-视图-控制器）架构的实现。UI标签是Struts提供的用于构建用户...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值