JavaWeb

一、ajax是什么

• Asynchronous JavaScript + XML，异步的avaScript和xml, 是一种用来 改善用户体验的技术

• 其实质就是利用浏览器的一个内置的特殊对象(XMLHttpRequest, 一般称为ajax对象)异步的(ajax在向服务器发送请求时，浏览器并不会销毁当 前页面，用户仍然可以对当前页面做其他操作)向服务器发送请求。服务器会返回部分数据(不是一一个完整的页面，只是一-些数据)，在浏览器端可以利用这些数据部分更新当前页面的内容，整个过程,页面不刷新，不打断用户操作

• 一句话描述ajax：一种不需要刷新整个页面的。能够实现页面局部内容更新的客户端技术

二、同步请求和异步请求

• 同步请求：

  • 发送了一个请求，就要等待服务器响应结束，才能发送第二个请求

  • 响应的是整个页面，如果页面.上数据量比较大的话，会等待一段时间，给用户的感觉是卡顿

• 异步请求：

  • 发送了一个请求，不需要等待服务器响应结束，能发送第二个请求

  • 响应的不是完整的页面，只是一部分数据，利用js更新到页面上

三、ajax的应用场景

• 百度等各大搜索引擎都应用了ajax技术

• 注册时，用户名是否被占用的验证功能

四、ajax的优缺点

• 优点：

  • 页面无刷新，不打断用户操作，用户体验良好

  • 按需获得数据，客户端和服务器传输的数据量大大减少

• 缺点:

  • 因为频繁的向服务器发送请求，无形中增加了对服务器的访问次数

五、利用jquery发送ajax请求

//利用jquery发送ajax请求
//验证员工姓名是否已经存在
$("[name=ename]").blur(function () {
    $.ajax({
        type: "get", //请求方式
        url: "CheckEnameServlet", //要请求的资源路径
        data: { //请求参数
            ename: $("[name=ename]").val()
        },
        dataType: "text",//响应数据的类型，默认是text
        // 响应成功的回调函数，data是响应回的数据
        success: function (data) {
            $("#enameMsg").html(data)
        },
        error: function () {
            alert("执行失败")
        }
    })
})

//执行代码

• 参数

  • url:要请求的资源路径，字符串表示

  • type: "get"或"post", 请求方式

  • data:请求参数

  • timeout:请求超时时间，单位是毫秒，数值表示

  • cache:是否缓存请求结果，boolean类型

  • contentType: 内容类型，默认ppliatin/www-form-urlencoded"

  • dataType:服务器响应的数据类型，默认是text

  • success:请求成功后的回调函数

  • error:请求失败后的回调函数

  • complete:请求完成后的回调函数，不论请求成功还是失败，都会调用该函数，在success或error之 后被调用

  • async: 是否异步处理，boolean表示， 默认是true, 如果设置为 false, js不会向下执行，而是原地等待服务器响应回数据，执行完相应的回调函数之后，再向下执行