AJAX应用中必须要掌握的重点知识(分享)

AJAX是什么?

是Asynchronous Javascript And XML的首字母的缩写, 它不是一门的新的语言,而是对现有技术的综合利用。 其本质是在HTTP协议的基础上以异步的方式与服务器进行通信。

异步的概念?

指某段程序执行时不会阻塞其它程序执行,其表现形式为程序的执行顺序不依赖程序本身的书写顺序,相反则为同步。

异步的作用?

其优势在于不阻塞程序的执行,从而提升整体执行效率。

AJAX的核心?

XMLHTTPRequest,简写XHR,Xml可扩展标记语言,Http超文本传输协议,Request请求。XMLHttpRequest对象可以在不向服务器提交整个页面的情况下,实现局部更新网页。XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步返回 Web 服务器的响应,并且能以文本或者一个 DOM 文档形式返回内容。它可以接收任何形式的文本文档,是 AJAX 的 Web 应用程序架构的一项关键功能。

前文说到XMLHTTPRequest可以接收任何形式的文档,那么就不得不提到在网络传输中常用的两个数据格式。

两种常用的数据格式xml和JSON?

xml:

xml的定义:可扩展标记语言,是一种用于标记电子文件使其具有结构性的标记语言。

xml的规范:

1、必须有一个根元素
2、不可有空格、不可以数字或.开头、大小写敏感
3、不可交叉嵌套
4、属性双引号(浏览器自动修正成双引号了)
5、特殊符号要使用实体
6、注释和HTML一样

虽然可以描述和传输复杂数据,但是其解析过于复杂并且体积较大,所以实现开发已经很少使用了。

xml使用步骤简述:

由于xml是DOM对象,可以直接DOM方法,

1、var xml=xhr.responseXML;获取XML(PHP给的接口)

2、var items=xml.querySelector('item');获取xml的文档结构

3、字符串拼接

3.1、初始化var html='';

3.2、遍历for(){获取数据var item=item[i],}拼接html+='标签+数据'

4、渲染document.querySelector('tbody').innerHTHML=html

JSON:

JSON定义:JavaScript Object Notation,另一种轻量级的文本数据交换格式,独立于语言。

JSON的规范:

1、数据在名称/值对中
2、数据由逗号分隔(最后一个健/值对不能带逗号)
3、花括号保存对象方括号保存数组
4、使用双引号

JSON的跨语言解析:

JSON数据在不同语言进行传输时,类型为字符串,不同的语言各自也都对应有解析方法,需要解析完成后才能读取。

1、PHP解析方法

数组转json字符 json_encode->$json_array = json_encode($array);

json字符转成数组 json_decode->$array_json = json_decode($json_array);

2、Javascript 解析方法

字符串转对象parse->var jsonObj=JSON.parse(jsonStr);

对象转字符串stringify->var jsonStr=JSON.stringify(jsonObj);

tips:JSON兼容处理引用json2.js

XMLHttpRequest中的事件监听onreadystatechange?

以上这篇AJAX应用中必须要掌握的重点知识(分享)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • Ajax基础详解教程(一)

    什么是Ajax? 在研究ajax之前首先让我们先来讨论一个问题 --什么是Web 2.0 .听到 Web 2.0 这个词的时候,应该首先问一问 "Web 1.0 是什么?" 虽然很少听人提到 Web 1.0,实际上它指的就是具有完全不同的请求和响应模型的传统 Web.比如,到 hdu.edu.cn 网站上点击一个按钮.就会对服务器发送一个请求,然后响应再返回到浏览器.该请求不仅仅是新内容和项目列表,而是另一个完整的 HTML 页面.因此当 Web 浏览器用新的 HTML 页面重绘时,可

  • Jquery之Ajax运用 学习运用篇

    还是先说一些基础知识: 语法:$.ajax({option}) option表示参数.以key/value形式出现. 常用参数:type:post/get. url:发送请求的地址. data:{object:object} 发送到服务器的数据,必须为key/value格式.可以设置processData属性,不转换数据格式. success:function(msg){} 请求成功后回调函数. error:function(msg){} 请求失败后回调函数. dataType:xml/html

  • AJAX应用中必须要掌握的重点知识(分享)

    AJAX是什么? 是Asynchronous Javascript And XML的首字母的缩写, 它不是一门的新的语言,而是对现有技术的综合利用. 其本质是在HTTP协议的基础上以异步的方式与服务器进行通信. 异步的概念? 指某段程序执行时不会阻塞其它程序执行,其表现形式为程序的执行顺序不依赖程序本身的书写顺序,相反则为同步. 异步的作用? 其优势在于不阻塞程序的执行,从而提升整体执行效率. AJAX的核心? XMLHTTPRequest,简写XHR,Xml可扩展标记语言,Http超文本传输协

  • php面向对象重点知识分享

    1.$this是什么 当前类实例化的对象 2.访问对象中的成员 对象->成员 3.构造方法 通常用来初始化对象的属性,不用把属性写死,不同的对象就有了不同的属性 4.get.set的用法 通常将属性设为protected,利用getXxx和setXxx方法来设置和获取属性的值,避免外部随意的更改,同时还可以对对象进行过滤. 5.类的封装 public方法可以在类外访问,相当于提供给外部的接口 private方法只能在类内(即类的大括号内),外部不能直接访问,只能通过其他public方法来调用,就

  • Ajax请求中async:false/true的作用分析

    本文实例分析了Ajax请求中async:false/true的作用.分享给大家供大家参考,具体如下: test.html代码: <a href="javascript:void(0)" onmouseover="testAsync()"> asy.js代码: function testAsync(){ var temp; $.ajax({ async: false, type : "GET", url : 'tet.php', com

  • Dom在ajax技术中的作用说明

    今天我们来讲一下Dom在ajax技术中的作用.当你使用ajax向服务端发出请求,并返回数据到客户端时.你是怎么 将这些返回的数据显示到网页上的?毫无疑问的你使用的是Dom,利用Dom的各个指令.来向html中添加你想要显示的内容.例如:getElementById也或是getElementsByTagName查找元素 innerHTML显示内容?还是appendChild添加元素?当然创建一个不存在的元素也是可以的createElement可以轻松实现. 如果你想要创建够酷够炫的ajax效果.这

  • 关于Ajax请求中传输中文乱码问题的解决方案

    今天遇到一个问题,有关ajax 请求中传输中文,遇到乱码的问题. 如下代码: function UpdateFolderInfoByCustId(folderId, folderName, custId) { $.ajax({ type: "Post", contentType: "application/x-www-form-urlencoded; charset=utf-8", url: "http://localhost/CRM/Ashx/HandK

  • 细数Ajax请求中的async:false和async:true的差异

    实例如下: function test(){ var temp="00"; $.ajax({ async: false, type : "GET", url : 'userL_checkPhone.do', complete: function(msg){ alert('complete'); }, success : function(data) { alert('success'); temp=data; temp="aa"; } }); a

  • 关于Ajax技术中servlet末尾的输出流

    Ajax的服务器端用PrintWriter out=resp.getWriter()来响应数据的时候,out.print(0).out.print(1)来表示成功或失败,而不用out.write是有原因的,首先来看一下print和write两者的异同点. 共同点是:两者都不刷新页面,只在原来的页面写数据.最终都是重写了抽象类Writer里面的write方法. 区别是:print方法可以将各种类型的数据转换成字符串的形式输出.而重载的write方法只能输出字符.字符数组.字符串等与字符相关的数据.

  • ajax调用中ie缓存问题解决方法

    本文实例分析了ajax调用中ie缓存问题解决方法.分享给大家供大家参考,具体如下: ajax请求调用的过程中发现的问题:后台请求是一个简单的.aspx文件,而这个页面又没有考虑过缓存的影响,使用ajax调试的时候发现有时候根本不走后台代码直接返回结果了,所以估计是受到浏览器缓存的影响.网上搜了一下,果然是缓存的问题:"IE中如果XMLHttpRequest提交的URL与历史一样则使用缓存,根本不向服务器端提交.因此无法取到刚提交的数据或新的数据". 解决方法大致有下面几种: 1.只改进

  • 详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)

    test.html <a href="javascript:void(0)" rel="external nofollow" onmouseover="testAsync()"> asy.js function testAsync(){ var temp; $.ajax({ async: false, //同步请求 type : "GET", url : 'tet.php', complete: function(

  • 学习Vue框架中必掌握的重点知识

    一.什么是vue vue是一套用于构建用户页面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合.另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动. 二.与原生JS的区别 我们可以通过一个小案例来演示 案例:把输入框中的信息实时显示在span标签中 原生JS <body> <input id='txt' type="text&qu

随机推荐