Web基础了解版11-Ajax-JSON
Ajax
AJAX即“Asynchronous Javascript And XML”:是,不发生页面跳转、异步请求载入内容并改写局部页面内容的技术。
也可以简单的理解为通过JS向服务器发送请求。
同步处理:
就是当我们通过一个页面向服务器发送一个请求时,在服务器响应结束之前,我们的整个页面是不能操作的,并且即使整个页面中只有一小部分内容发生改变我们也要刷新整个页面。
异步处理:
通过AJAX向服务器发送请求,当服务器正常响应请求后,响应信息会直接发送到AJAX中,AJAX可以根据服务器响应的内容做一些操作。并可局部的修改页面,而不需要整个页面刷新。
请求对象:XMLHttpRequest
- XMLHttpRequest对象用来封装请求报文,我们向服务器发送的请求信息全部都需要封装到该对象中。
获取XMLHttpRequest对象,不同浏览器之间有差异
//获取XMLHttpRequest的通用方法
function getXMLHttpRequest(){
var xhr;
try{
//大部分浏览器都支持
xhr = new XMLHttpRequest();
}catch(e){
try{
//如果不支持,在这里捕获异常并且采用IE6支持的方式
xhr = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
//如果还不支持,在这里捕获异常并采用IE5支持的方式
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xhr;
}
XMLHttpRequest对象的方法
open(method,url,async):用于设置请求的基本信息,接收三个参数。
参数一:method
接收一个字符串,表明请求的方法:get或post
参数二:url
请求的地址,接收一个字符串
参数三:Assync
发送的请求是否为异步请求,接收一个布尔值。① true 是异步请求 ② false 不是异步请求(同步请求)
send(string):用于将请求发送给服务器,可以接收一个参数
string参数
该参数只在发送post请求时需要。用于设置请求体
setRequestHeader(header,value):用于设置请求头
参数一:header参数
字符串类型,要设置的请求头的名字
参数二:value参数
字符串类型,要设置的请求头的值
XMLHttpRequest对象的属性
readyState
描述XMLHttpRequest的状态
一共有五种状态分别对应了五个数字:
0 :请求尚未初始化,open()尚未被调用
1 :服务器连接已建立,send()尚未被调用
2 :请求已接收,服务器尚未响应
3 :请求已处理,正在接收服务器发送的响应
4 :请求已处理完毕,且响应已就绪。
status
请求的响应码
200 响应成功
404 页面为找到
500 服务器内部错误
......
onreadystatechange
该属性需要指向一个函数
该函数会在readyState属性发生改变时被调用
responseText
获得字符串形式的响应数据。
responseXML(用的比较少)
获得 XML 形式的响应数据。
JQuery的Ajax请求
四个Ajax请求方法
$.ajax方法
$.get方法
$.post方法
$.getJSON方法
一个表单序列化方法:serialize()表单序列化方法
$.ajax请求
- url: 请求的地址
- type : 请求的方式 get或post
- data : 请求的参数 string或json
- success: 成功的回调函数
- dataType: 返回的数据类型 常用json或text
$.get和$.post请求
- url:请求的URL地址
- data:待发送 Key/value 参数。
- callback:载入成功时回调函数。
- type:返回内容格式,xml, html, script, json, text。
$.getJSON请求
- url:待载入页面的URL地址
- data:待发送 Key/value 参数。
- callback:载入成功时回调函数。
表单的序列化
serialize() 方法可以把一个form表单中所有的表单项。都以字符串name=value&name=value的形式进行拼接
$.ajax({
url : "ajaxServlet", // 请求地址
error:function(){ // 请求失败回调
alert("请求失败");
},
success:function(data){ // 请求成功回调
alert( data );
},
type:"POST", // 请求的方式
dataType:"json", // 返回的数据类型为json对象
data:{ // 请求的参数
action:"jqueryAjax",
a:12,
date: new Date()
}
});
JSON
JSON是JavaScript Object Notation 的缩写,是JS提供的一种轻量级的数据交换格式, 易于人阅读和编写。同时也易于机器解析和生成。
JSON对象本质上就是一个JS对象,但是这个对象比较特殊,它可以直接转换为字符串,在不同语言中进行传递,通过工具又可以转换为其他语言中的对象。
在标准的json格式中,json对象由大括号括起来,对象中的属性也就是json的key是一个字符串,所以一定要使用双引号引起来。每组key之间使用逗号进行分隔。
JSON 6种数据类型
字符串 //注意:不能使用单引号
数字
布尔值
null值
对象
例子:{“name”:”sunwukong”, ”age”:18}
数组
例子:[1,”str”,true]
JSON对象的访问
key就是对象的属性。我们要访问一个对象的属性,只需要使用【对象名.属性名】的方式访问即可。
JSON对象和字符串对象的互转
JSON.stringify( json ):此方法可以把一个json对象转换成为json字符串
JSON.parse( jsonString ): 此方法可以把一个json字符串转换成为json对象
JSON在Java中的使用
Gson 提供了用来在 Java 对象和 JSON 数据之间进行映射的 Java 类库,可以将一个 JSON 字符串转成一个 Java 对象,或者反过来。
java对象和json的转换
java对象list集合和json的转换
map对象和json的转换
// json操作,一定要先new一个gson对象。
Gson gson = new Gson(); // 1、把对象转成为json字符串
String personjson = gson.toJson(person);
// 把json字符串转换成为java对象
Person p = gson.fromJson(personjson, Person.class); //2、java对象list集合和json的转换
String jsonListString = gson.toJson(list);
// 把json数组转换成为List对象
List<Person> ps = gson.fromJson(jsonListString, new PersonType().getType()); // 3、map对象和json的转换
String jsonMapString = gson.toJson(mapPerson);
// 通过使用匿名内部类的方式
Map<String, Person> map = gson.fromJson(jsonMapString,new TypeToken<HashMap<String, Person>>() {}.getType());
Web基础了解版11-Ajax-JSON的更多相关文章
- Web基础了解版07-EL表达式-运算符-11个隐式对象
EL EL(Expression Language)是JSP内置的表达式语言,用以访问页面的上下文以及不同作用域中的对象 ,取得对象属性的值,或执行简单的运算或判断操作.EL在得到某个数据时,会自动进 ...
- Web基础了解版03-jQuery
jQuery jQuery,顾名思义,也就是JavaScript和查询(Query)极大地简化了JavaScript开发人员遍历HTML文档.操作DOM.处理事件.执行动画和开发Ajax. jQuer ...
- Web基础了解版04-XML-Tomcat-Http
XML 什么是XML - Tomcat - Http XML:eXtensible Markup Language (可扩展标记语言). XML 是一种标记语言,很类似 HTML. XML 的设计宗旨 ...
- Web基础了解版02-JavaScript
JavaScript 特性 ① 解释型语言.JavaScript是一种解释型的脚本语言,JavaScript是在程序的运行过程中逐行进行解释,不需要被编译为机器码再执行. ② 面向对象.JavaScr ...
- Web基础了解版05-Servlet
Servlet Servlet? 从广义上来讲,Servlet规范是Sun公司制定的一套技术标准,包含与Web应用相关的一系列接口,是Web应用实现方式的宏观解决方案.而具体的Servlet容器负责提 ...
- Web基础了解版06-Jsp
Jsp Jsp全称Java Server Pages,也就是在我们JavaWeb中的动态页面. Jsp能够以HTML页面的方式呈现数据,是一个可以嵌入Java代码的HTML. Jsp其本质就是一个Se ...
- Web基础了解版10-Filter-Listener
Filter 对于WEB应用来说,过滤器是一个驻留在服务器中的WEB组件,他可以截取客户端和WEB资源之间的请求和响应信息. 在一个WEB应用中可以部署多个过滤器,多个过滤器就组成了一个过滤器链,请求 ...
- Web基础了解版09-Cookie-Session
Cookie Cookie 是一种服务器发送给浏览器以键值对形式存储小量信息的技术. 当浏览器首次请求服务器时,服务器会将一条信息封装成一个Cookie发送给浏览器,浏览器收到Cookie,会将它保存 ...
- Web基础了解版01-html-css
HTML 网页构成 摘要 说明 结构(HTML) HTML是网页内容的载体.内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字.图片.视频等. 表现(CSS) CSS样式是表现.就像网页的 ...
随机推荐
- Codeforces Round #591 (Div. 2, based on Technocup 2020 Elimination Round 1) 题解
A..B略 C 对当前的值排序,再二分答案,然后对于(i%x==0 && i%y==0)放入大的,再放其他的贪心解决即可. #include<iostream> #incl ...
- js切割字符串
var time_str= '2019-9-10 13:18:20'; var t = time_str.substr(2,8); console.log(t); 输出 19-9-10
- 在SuperSocket中启用TLS/SSL传输层加密
关键字: TLS, SSL, 传输层加密, 传输层安全, 证书使用, X509Certificate SuperSocket 支持传输层加密(TLS/SSL) SuperSocket 有自动的对TLS ...
- spring+mybatis 整合
项目目录: 一.导入pom.xml依赖 最下边有 二.在applicationContext.xml配置连接器和数据库的数据源 三.流程:用户请求数据,springmvc解析url,通过控制器和适配器 ...
- SQL 变量,运算符
一.变量 SQL语言也跟其他编程语言一样,拥有变量.分支.循环等控制语句. 在SQL语言里面把变量分为局部变量和全局变量,全局变量又称系统变量. (一).局部变量 使用declare关键字给变量声明, ...
- H3C 帧中继配置示例
- HDU 2674
0 <= N<=10^9 看到这个数据范围知道常规方法肯定做不出来. 不过一想想既然是mod2009,是不是只要其中含有一个2009,那么其结果一定是0了呢 说了这里思路,就是看什么时候出 ...
- 如何读取redis中的key值中的结果
redis的值有5种类型,不同的类型有不同的命令来获取: 字符直接 get key 队列 左端弹出一个元素 LPOP key 哈希 HGET key field 集合 SMEMBERS key 返回 ...
- P1087 N个数的最大公约数
题目描述 今天灵灵学习了使用欧几里得算法(即:辗转相除法)求解两个数的最大公约数.于是他决定用这个方法求解 \(N\) 个数的最大公约数. 输入格式 输入的第一行包含一个整数 \(N(1 \le N ...
- H3C 什么是路由