Ajax y Json
Ajax
1. Concepto
Ajax es Asynchronous Javascript And XML (JavaScript asíncrono y XML), que utiliza JavaScript para realizar una solicitud al servidor y procesar la respuesta sin bloquear el objeto principal XMLHttpRequest del usuario. A través de este objeto, tu JavaScript puede intercambiar datos con el servidor web sin recargar la página, es decir, se puede producir un efecto de refresco parcial sin necesidad de refrescar la página . Ajax utiliza la transferencia de datos asíncrona (solicitudes HTTP) entre el navegador y el servidor web , lo que permite que las páginas web soliciten pequeñas cantidades de información del servidor en lugar de toda la página.
2. Aplicación
1) Usar XHTML+CSS para expresar información;
2) Use JavaScript para operar DOM (Modelo de objeto de documento) para realizar efectos dinámicos;
3) Use XML y XSLT para manipular datos;
4) Use XMLHttpRequest o la nueva Fetch API para intercambiar datos de forma asíncrona con el servidor web;
- Nota: AJAX se diferencia de las tecnologías RIA como Flash, Silverlight y Java Applets.
3. Características
Los datos se pueden mantener sin actualizar toda la página. Esto hace que las aplicaciones web respondan mejor a las acciones del usuario y evita enviar mensajes sin cambios a través de la red.
No se requieren complementos del navegador, pero se requiere que el usuario permita que JavaScript se ejecute en el navegador.
4. Sincronizar
principio
Cuando el navegador envía una solicitud síncrona al servidor, el navegador estará en estado de espera mientras el servicio procesa la solicitud síncrona. Después de que el servidor procese la solicitud, responderá con datos al navegador y sobrescribirá los datos originales en el la memoria del navegador El navegador—— Vuelva a cargar la página y muestre los datos de respuesta del servidor.
La sincronización se refiere al método de comunicación en el que el remitente envía datos y espera a que el receptor envíe una respuesta antes de enviar el siguiente paquete de datos.
Desde el punto de vista del usuario, las dos manerasla diferenciaen:
Síncrono: el consumidor invoca el servicio a través de un único subproceso; el subproceso envía la solicitud, se bloquea mientras el servicio se ejecuta y espera la respuesta. ( El cliente debe esperar la respuesta del servidor. El cliente no puede hacer nada más mientras espera. )
Asíncrono: el consumidor invoca el servicio a través de dos subprocesos: un subproceso envía la solicitud y otro subproceso recibe la respuesta. ( El cliente no necesita esperar la respuesta del servidor. Mientras el servidor procesa la solicitud, el cliente puede realizar otras operaciones )
// JQeury实现方式
1. $.ajax()
* 语法：$.ajax({
键值对});
//使用$.ajax()发送异步请求
$.ajax({
url:"ajaxServlet1111" , // 请求路径
type:"POST" , //请求方式
//data: "username=jack&age=23",//请求参数
data:{
"username":"jack","age":23},
success:function (data) {
alert(data);
},//响应成功后的回调函数
error:function () {
alert("出错啦...")
},//表示如果请求响应出现错误，会执行的回调函数
dataType:"text"//设置接受到的响应数据的格式
});
2. $.get()：发送get请求
* 语法：$.get(url, [data], [callback], [type])
* 参数：
* url：请求路径
* data：请求参数
* callback：回调函数
* type：响应结果的类型
*
3. $.post()：发送post请求
* 语法：$.post(url, [data], [callback], [type])
* 参数：
* url：请求路径
* data：请求参数
* callback：回调函数
* type：响应结果的类型
json
1. Concepto
JSON: notación de objetos de JavaScript; JSON es una sintaxis para almacenar e intercambiar datos; JSON es texto escrito en notación de objetos de JavaScript,Es un formato de intercambio de datos liviano, JSON es más pequeño, más rápido y más fácil de analizar que XML。
2. Sintaxis:
1. 基本规则
* 数据在名称/值对中：json数据是由键值对构成的
* 键用引号(单双都行)引起来，也可以不使用引号
* 值得取值类型：
1. 数字（整数或浮点数）
2. 字符串（在双引号中）
3. 逻辑值（true 或 false）
4. 数组（在方括号中） {"persons":[{},{}]}
5. 对象（在花括号中） {"address":{"province"："陕西"....}}
6. null
* 数据由逗号分隔：多个键值对由逗号分隔
* 花括号保存对象：使用{}定义json 格式
* 方括号保存数组：[]
2. 获取数据:
1. json对象.键名
2. json对象["键名"]
3. 数组对象[索引]
4. 遍历
//1.定义基本格式
var person = {
"name": "张三", age: 23, 'gender': true};
var ps = [{
"name": "张三", "age": 23, "gender": true},
{
"name": "李四", "age": 24, "gender": true},
{
"name": "王五", "age": 25, "gender": false}];
