微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

原生ajax请求的五个步骤

什么是ajax?
通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
ajax的优点:
1.实现局部更新(无刷新状态下)
2.减轻了服务器端的压力
ajax的缺点:
1.破坏了浏览器前进和后退机制(因为ajax自动更新机制)
2.一个Ajax请求多了,也会出现页面加载慢的情况。
3.搜索引擎的支持程度比较低。
4.ajax的安全性问题不太好(可以用数据加密解决)。
注:如果要使用ajax必须要有后端环境的支持(服务器端)。
原生ajax请求的五个步骤:
1.实例化请求对象
2.建立服务器链接
3.监听服务器响应
4.发送请求
5.响应成功,传递参数
http请求的两种方式:
get:用于获取数据,get是在url上传递数据(网址后面的东西),存储量较少,安全系数比较低。
post:用于上传数据,容量几乎是无限(多用于表单)。

 //1.实例化请求对象
    var http=new XMLHttpRequest ();
 //2.建立服务器链接
          //1.请求方式   get post
          //2.url    服务器接口
          //3.async     指当前请求是同步还是异步     true/false
          //同步:请求完成后去执行后续代码(等待请求完成 )        false
          //异步:请求和后续代码同时执行(不需等待,所有代码同时执行)   true
          //4.5.  用户名和密码,(为了安全)
    http.open();
 /*3.监听服务器响应   1 2 3 4   服务器响应状态    404(页面丢失  200(成功  500(服务器报错*/
    http.onreadystatechange =function(){
        //服务器响应
        if(http.readyState ==4&&http.status ==200){
        //5.响应成功,传递参数
            //可以获取数据
            //服务器返回是json
            http.response
            http.responseText
            //后台返回数据是XML(自定义的html格式)
            http.responseXML
        }
    }
    //4.发送请求
           //send方法的参数取决于请求方式    get post
           //get   url+"?id=1&name=111"
           //post   send()    方法,传递参数
    http.send();

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐