美文网首页
Ajax基础

Ajax基础

作者: 阿九是只大胖喵 | 来源:发表于2017-03-20 18:43 被阅读0次

Ajax: Aysnc JavaScript and XML

XML: 可拓展的标记语言(在XML文件中使用的标签都是自己拓展的)
利用自己拓展的有规则的标记来存储相关的数据

客户端JavaScript中的方法,用来向服务器端发送请求(还可以传递给服务器端数据),然后把服务器端返回的内容获取到(Ajax一般运行在客户端的浏览器中)

Ajax四步:

-> 创建一个Ajax对象(下面的这种写法在IE6及更低版本的浏览器中不支持)
var xhr = new XMLHttpRequest();

-> 发送前的基本信息配置:
   配置请求的方式(get, post, put, delete, ...)
   打开一个URL地址(配置向哪一个服务器地址发送请求)
   同步还是异步(true: 异步, false: 同步; 默认是true)
   [username]: 向服务器提供请求的用户名
   [password]: 向服务器提供请求的密码, 这两个值一般不写, 只有服务器做了安全限制, 只允许特定的用户访问时才传递
xhr.open('get', url, false);

-> 给onreadystatechange这个事件绑定一个方法, 监听状态的改变(只要状态改变,就会触发方法执行)
xhr.onreadystatechange = function() {
    // -> xhr.readyState: Ajax状态码,可以代表当前Ajax处理的进度
                        0 -> unset: 当前的请求还没有发送
                        1 -> opened: URL地址已经打开(发送前的参数配置已经完成)
                        2 -> header_received: 响应头信息已经接受
                        3 -> loading: 主要返回的内容正在服务器端进行处理
                        4 -> done: 响应主体内容已经成功返回到客户端
       -> xhr.status: HTTP网络状态码,描述了服务器响应内容的状态
                      200 或者 /^\d{2}$/ -> 都代表响应主体内容已经成功返回
                      
                      301 -> 永久重定向/永久转移
                      302 -> 临时重定向/临时转移 服务器的负载均衡
                      304 -> 本次获取的内容是读取缓存中的数据
                      
                      400 -> 客户端传递给服务器端的参数出现未知错误
                      401 -> 无权限访问
                      404 -> 客户端访问的地址不存在
                      
                      500 -> 未知的服务器错误
                      503 -> 服务器已经超负荷 一台服务器能承受一万人,那10001个人访问,如果没有做服务器的负载均衡,那么此时状态码变为501

   if (xhr.readyState === 4 && /^2\d{2}$/.test(xhr.status)) {
        var data xhr.responseText;
   }
}

-> 发送请求: 参数是请求主体中传递给服务器的内容
xhr.send(null);

相关文章

  • face14ajax基础内容

    ajax基础内容 ajax技术利用了 什么协议?简述ajax的工作机制 写出jquery中,可以处理ajax的几种...

  • AJAX简易封装(四步)

    最基础的ajax封装如下:

  • ajax配置信息

    基础的ajax配置信息

  • 2019-02-14day9学习总结

    修改标签的层次 Ajax基础

  • AJAX基础及原理

    AJAX基础知识 什么是AJAX?async javascript and xml, 异步的JS和XML XML:...

  • Web前端-Ajax基础技术(下)

    Web前端-Ajax基础技术(下) 你要明白ajax是什么,怎么使用? ajax,web程序是将信息放入公共的服务...

  • 前端基础搬运工-Ajax模块

    七、Ajax模块 基础部分 1. ajax是什么? - [ ] Ajax并不算是一种新的技术,全称是asychr...

  • AJax基础

    什么是Ajax Ajax是用JavaScript执行异步网络请求,请求是异步执行的,也就是说,要通过回调函数获得响...

  • ajax基础

    基本格式 get 发送数据在 xhr.open('post','testlog.php?name='+this.v...

  • ajax基础

    概述 Asynchronous JavaScript and XML,异步传输无刷新技术。提高用户体验的技术。“异...

网友评论

      本文标题:Ajax基础

      本文链接:https://www.haomeiwen.com/subject/pmeinttx.html