Ajax(一):ajax相关总结

一,首先了解什么是局部刷新和全局刷新:

        ①全局刷新,通俗的来说就是浏览器整个页面全部都改变,在本网页中的全部内容全部的重新加载,看到的都是新的内容。

        ②局部刷新,就是网页中内容点击某一项之后,是单独的那一项改变,不是整个页面全部的都被改变。

二,Ajax是什么:

        1,ajax是一种实现局部刷新的新技术,无需重新加载整个网页,能够更新部分页面内容的新方法。AJAX 不单需要前端的技术,同时需要后端(服务器)的配合。服务器需要提供数据,数据 是 AJAX 请求的响应结果。

        2,XMLHttpRequest

        在局部刷新,需要创建一个对象,代替浏览器发起请求的行为,这个对象存在内存中。 代替浏览器发起请求并接收响应数据。这个对象叫做异步请求对象。这个异步对象用于在后台与服务器交换数据。XMLHttpRequest 就是我们说的异步对象。

        XMLHttpRequest 对象作用:

                ①在不重新加载页面的情况下更新网页

                ②在页面已加载后向服务器请求数据

                ③在页面已加载后从服务器接收数据
 

        创建 XMLHttpRequest 对象的语法(xhr):

         var xmlhttp=new XMLHttpRequest();

AJAX 中的核心对象就是 XMLHttpRequest     

  2,ajax异步实现步骤

        (1) 创建对象方式 var xmlHttp = new XMLHttpRequest();

        (2) onreadstatechange 事件 当请求被发送到服务器时,我们需要执行一些基于响应的任务。每当 readyState 改变 时,就会触发 onreadystatechange 事件。此事件可以指定一个处理函数 function。通过判断 XMLHttpReqeust 对象的状态,获取服务端返回的数据。

语法: xmlHttp.onreadystatechange= function() {

if( xmlHttp.readyState == 4 && xmlHttp.status == 200){

处理服务器返回数据 } }

下面是 XMLHttpRequest 对象的三个重要的属性:

属性说明: onreadystatechange 属性:一个 js 函数名 或 直接定义函数,每当 readyState 属性 改变时,就会调用该函数 readyState 属性: 存有 XMLHttpRequest 的状态。

从 0 到 4 发生变化。

• 0: 请求未初始化,创建异步请求对象 var xmlHttp = new XMLHttpRequest()

• 1: 初始化异步请求对象, xmlHttp.open(请求方式,请求地址,true)

• 2: 异步对象发送请求, xmlHttp.send()

• 3: 异步对象接收应答数据 从服务端返回数据。XMLHttpRequest 内部处理。

• 4: 异步请求对象已经将数据解析完毕。 此时才可以读取数据。

status 属性:

        200: "OK"

        404: 未找到页面

(3) 初始化请求参数:

方法: open(method,url,async) : 初始化异步请求对象

参数说明:

• method:请求的类型;GET 或 POST

• url:服务器的 servlet 地址

• async:true(异步)或 false(同步)

例如: xmlHttp.open(“get”,”http:192.168.1.20:8080/myweb/query”,true)

(4) 发送请求

        xmlHttp.send()

   (5) 接收服务器响应的数据

如需获得来自服务器的响应,请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。

responseText:获得字符串形式的响应数据

responseXML:获得 XML 形式的响应数据

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值