浅谈ajax请求技术

 更新时间:2016年07月22日 08:30:33   投稿:jingxian  
下面小编就为大家带来一篇浅谈ajax请求技术。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

1.写在前面:

阅读要求:

具有一定的HTML、CSS、JavaScript、Json基础

2.什么是ajax

Ajax:即”Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。

3.为什么使用ajax

在动态网页开发技术中,客户端(通常是浏览器)与服务端进行数据交互是十分频繁的,如何节省网络资源,提供良好的用户体验是十分关键的。Ajax采用异步请求方式,使得不用刷新整个页面就可以和后台实现数据交互,从而更新内容...

4.如何使用原生的ajax

使用ajax技术的关键点落在了XMLHttpRequest(注:ie5、ie6使用ActiveXObject)对象上,因此利用好该对象是关键

注意:

    

function loadData() {

  //创建XMLHttpRequest对象

  var xmlHttpRequestObj = {};

  //创建json对象,传送json格式数据到服务端

  Var jsonObj = {};

  if (window.XMLHttpRequest) {

  // IE7+, Firefox, Chrome, Opera, Safari

     xmlHttpRequestObj =new XMLHttpRequest();

   } else {

     // IE6, IE5

     xmlHttpRequestObj =new ActiveXObject("Microsoft.XMLHTTP");

   }

  //当请求状态改变时会调用xmlHttpRequestObj .onreadystatechange方法

    xmlHttpRequestObj .onreadystatechange = function() {

     if (xmlHttpRequestObj .readyState == 0 ) {

      Alert(“open()函数未执行”);

       } else if(xmlHttpRequestObj.readyState == 1) {

        Alert(“open()函数已执行,send()函数未执行”);

     } else if(xmlHttpRequestObj.readyState == 2) {

        Alert(“send()函数已执行,头部和状态码可以获取”)

     } else if(xmlHttpRequestObj.readyState == 3) {

        Alert(“头部已收到,解析响应体”);

    } else if(xmlHttpRequestObj.readyState == 4) {

        Alert(“请求完成”);

        If (xmlHttpRequestObj.status == 200) {

          Alert(“响应就绪,反序列化json对象填充数据到页面”);

        } else if (xmlHttpRequestObj.status == 400) {

          Alert(“页面丢失”);

        } else {

          Alert(“服务异常”);

        }

    }

   }

  //method:请求方式:GET、POST、PUT、DELETE... Url:请求的地址 asnyc:是否采用异步

  xmlHttpRequestObj.open("method", "url", async);

  //设置请求头,POST请求格式需要载入,其他不需要

  xmlHttpRequestObj.setRequestHeader("Content-type","application/x-www-form-urlencoded");

  //请求数据,参数为jsonObj json对象

  xmlHttpRequestObj.send(jsonObj);

}

以上这篇浅谈ajax请求技术就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Boa服务器下的ajax与cgi通信

    Boa服务器下的ajax与cgi通信

    最近小编在研究嵌入式开发的课程设计,接下来通过本篇文章给介绍了Boa服务器下的ajax与cgi通信的相关资料,非常不错,具有参考借鉴价值,感兴趣的朋友一起看下吧
    2016-07-07
  • 纯javascript的ajax实现php异步提交表单的简单实例

    纯javascript的ajax实现php异步提交表单的简单实例

    下面小编就为大家带来一篇纯javascript的ajax实现php异步提交表单的简单实例。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • Ajax提交表单页面刷新很快的解决方法

    Ajax提交表单页面刷新很快的解决方法

    这篇文章主要介绍了Ajax提交表单页面刷新很快的解决方法,需要的朋友可以参考下
    2017-01-01
  • 原生AJAX封装的简单实现

    原生AJAX封装的简单实现

    下面小编就为大家带来一篇原生AJAX封装的简单实现。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-07-07
  • Ajax验证用户的唯一性

    Ajax验证用户的唯一性

    这篇文章主要介绍了Ajax验证用户的唯一性,验证环境Ajax+Jquery+Json+struts2,感兴趣的小伙伴们可以参考一下
    2016-05-05
  • 什么是Ajax

    什么是Ajax

    ajax不是一种语言,而是多种技术组合在一起使用,ajax只是这几种技术组合的代名词
    2010-10-10
  • Ajax Session失效跳转登录页面的方法

    Ajax Session失效跳转登录页面的方法

    这篇文章主要介绍了Ajax Session失效跳转登录页面的方法,非常不错具有参考借鉴价值,感兴趣的朋友一起看下吧
    2016-06-06
  • ajax实现加载数据功能

    ajax实现加载数据功能

    这篇文章主要为大家详细介绍了ajax实现加载数据功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-05-05
  • Ajax返回值类型与用法实例分析

    Ajax返回值类型与用法实例分析

    这篇文章主要介绍了Ajax返回值类型与用法,结合实例形式分析了ajax返回值的xml类型与文本类型详细分类、用法与相关操作注意事项,需要的朋友可以参考下
    2019-07-07
  • Ajax 跨域如何实现

    Ajax 跨域如何实现

    这篇文章主要介绍了Ajax 跨域如何实现的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
    2016-05-05

最新评论