Ajax详解及使用Ajax时的返回值类型有哪些?

Ajax详解

Ajax = 异步 JavaScript 和 XML。

Ajax 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

传统的网页(不使用 Ajax)如果需要更新内容,必需重载整个网页面。

(注:图片来自网络)

如何使用Ajax技术

首先,需要获取XMLHttpRequest对象:

var xhr;
xhr = new XMLHttpRequest();

XMLHttpRequest对象有5个核心属性:

  • onreadystatechange:当准备状态发生变化
  • readyState:准备状态,该属性的值可能是0~4之间的数字,0表示尚未建立连接,4表示接收到响应
  • status:响应码,例如404、200
  • responseText:响应的字符串
  • responseXML:响应的XML

当需要发出请求时,需要XMLHttpRequest对象的open()send()方法:

  • open(请求方式, 请求路径, 是否异步)
  • send()

使用演示:

// 异步检查用户名是否存在
function checkUsername(username) {
    // 获取XMLHttpRequest对象
    var xhr = new XMLHttpRequest();
    var url = "check_username.do?username="
            + username;

    // 配置onreadystatechange
    xhr.onreadystatechange = function() {
        // 当服务器已经响应(4)且响应码是200时
        if (xhr.readyState == 4
                && xhr.status == 200) {
            // 根据服务器的响应,显示响应的提示消息
            if (xhr.responseText == "1") {
                // 表示用户名存在
                document.getElementById("username_hint").innerHTML= "用户名正确";
            } else {
                // 表示用户名不存在
                document.getElementById("username_hint").innerHTML= "用户名不存在";
            }
        }
    };
    // 调用函数
    xhr.open("GET", url, true);
    xhr.send();
}

在JQuery中,Ajax有三种实现方式:

$.ajax({
    "url":"",   //访问路径
    "data":"",  // 需要传输的数据
    "type":"",  // 请求方式
    "dataType":"",  // 返回值类型
    "success":function(obj){},      // 响应成功时的回调函数
    "error":function(obj){}     // 响应失败时的回调函数
});

$.get(URL,callback);

$.post(URL,data,callback);



(注:以下内容来自https://www.cnblogs.com/fly-xfa/p/5851746.html)

使用Ajax时的返回值类型有哪些?
xml、html、script、JSON、jsonp、text

  • xml:返回XML文档,可用 jQuery 处理。
  • html:返回纯文本HTML信息;
  • script:返回纯文本JavaScript代码。不会自动缓存结果。除非设置了 “cache” 参数;
  • json:json方式和html方式在请求和服务器中完全是一样,请求的返回值实际上都是String对象,有两点不同,第一:html方式的时候并没有限制返回的字符串格式,而json方式的时候,必须符合json协议的规范。第二:html方式请求完成之后没有做任何的操作直接回调sucuess,而json多了一步就是加了eval,执行返回的字符串,看看源码data = eval_r("(" + data + ")");返回json对象;(方法的返回值是Javabean时,在响应体中响应成json字符串格式)
  • jsonp:jsonp方式的交互方式和js是一样的,本身xmlHttpRequest对象并不能跨域访问,但是script标签的src可以跨域访问,这里就注意两个概念:第一Ajax是不能跨域操作的,第二jQuery的jsonp是可以跨域操作,jsonp到底是什么东西呢?他是一个非官方的定义,目前的规范,需要服务器和客户端进行配合使用;
  • text:返回纯文本字符串。

原文地址:https://www.cnblogs.com/jpfss/p/9542370.html

时间: 2024-10-19 17:37:02

Ajax详解及使用Ajax时的返回值类型有哪些?的相关文章

jquery的ajax方法在无返回值时的返回值类型设定

2013-12-07 19:15:29|  分类: Web前端 |  标签:html  |举报|字号 订阅 $.ajax({ type: "post", url: "index.php", data: "id="+uid, dataType:"json", success : function(){ alert(1); }, error: function(){ alert(0); } }); 在jquery的ajax方法中,

[转]C#进阶系列——WebApi 接口返回值不困惑:返回值类型详解

本文转自:http://www.cnblogs.com/landeanfen/p/5501487.html 阅读目录 一.void无返回值 二.IHttpActionResult 1.Json(T content) 2.Ok(). Ok(T content) 3.NotFound() 4.其他 5.自定义IHttpActionResult接口的实现 三.HttpResponseMessage 四.自定义类型 五.总结 正文 前言:已经有一个月没写点什么了,感觉心里空落落的.今天再来篇干货,想要学

Web Api 接口返回值不困惑:返回值类型详解

前言:已经有一个月没写点什么了,感觉心里空落落的.今天再来篇干货,想要学习Webapi的园友们速速动起来,跟着博主一起来学习吧.之前分享过一篇 WebApi 接口参数:传参详解,这篇博文内容本身很基础,没想到引起很多园友关注,感谢大家的支持.作为程序猿,我们都知道参数和返回值是编程领域不可分割的两大块,此前分享了下WebApi的传参机制,今天再来看看WebApi里面另一个重要而又基础的知识点:返回值.还是那句话:本篇针对初初使用WebApi的同学们,比较基础,有兴趣的且看看. 使用过Webapi

赋值运算符函数的返回值类型详解

在c++赋值运算符函数的学习中,对于返回值类型的问题,一直非常费解,今天彻底总结一些每种不同返回值类型的结果: 1.当返回值为空时: <span style="font-size:14px;">void hasptr::operator=(const hasptr& s)</span> 这个时候如果只有一个'='(a = b)运算那就没问题,但是如果存在'='(a = b = c)的链式操作时,编译器就会报错 我们看:a = b = c: 程序会先运行

详解Android中那些酷炫返回方式的实现

Android手机都会有返回键,不管是实体键,还是虚拟键.Android用户主要也都是通过这个返回键操控页面返回方式的,不比IOS逼格甚高的只保留一个操作键.这种方式是最普遍的返回方式,还有一种也是比较常见的,那就是页面内部自己响应.绝大多数APP每个页面的设计图顶部左侧都会有一个返回键图标,偶尔也有奇葩的设计放在底部左侧,点击这个图标即finish掉当前页面.简单的介绍完了最常见的两种方式,下面为大家介绍两种更友好的交互方式. 拿大家比较常用的三款社交软件的交互来说.腾讯微博的返回方式除去上述

C#进阶系列——WebApi 接口返回值不困惑:返回值类型详解

原文地址:http://www.cnblogs.com/landeanfen/p/5501487.html 使用过Webapi的园友应该都知道,Webapi的接口返回值主要有四种类型 void无返回值 IHttpActionResult HttpResponseMessage 自定义类型 此篇就围绕这四块分别来看看它们的使用. 一.void无返回值 void关键字我们都不陌生,它申明方法没有返回值.它的使用也很简单,我们来看一个示例就能明白. public class ORDER { publi

WebApi 接口返回值不困惑:返回值类型详解。IHttpActionResult、void、HttpResponseMessage、自定义类型

首先声明,我还没有这么强大的功底,只是感觉博主写的很好,就做了一个复制,请别因为这个鄙视我,博主网址:http://www.cnblogs.com/landeanfen/p/5501487.html 使用过Webapi的园友应该都知道,Webapi的接口返回值主要有四种类型 void无返回值 IHttpActionResult     (需要MVC高版本才会支持,VS2012/2013不支持,请升级DLL文件或者到VS2015开发环境) HttpResponseMessage 自定义类型 此篇就

mybatis查询结果为空时的返回值问题

先贴出配置文件 <select id="queryUserGroupByName" resultType="UserGroupModel"> select * from user_group where roleName='user' and groupName=#{groupName} </select> 对应的mapper List<UserGroupModel>queryUserGroupByName(String grou

ajax详解

1.ajax介绍 1.1.什么是ajax 全称:Asynchronous JavaScript And XML(异步 JavaScript 及 XML) Ajax的作用:实现异步请求的技术. 什么是同步请求? 场景:页面上有一个a标签,用户点击a标签,浏览器发出一个请求,然后服务器给出一个响应. (请求,其实是用户的操作,触发的) 什么是异步(不同步)请求? 场景:在用户注册的时候,用户首先输入用户名,接下来用户继续填写其他注册信息,与此同时,浏览器自动发送了一个请求,将用户输入的用户名发送给服