前言:本文只会带大家大致熟悉一下这些名词的关系和基本用法。如果您是初学者,即将开始学习这个关键字,或者您打算先了解这些关键字的概念,那么这篇文章可能会对您有所帮助,但是如果您打算深入研究这些关键字,我很抱歉地通知您这篇文章可能不适合你现在的水平。我不喜欢用非常专业的术语来描述这些方法的功能。我更喜欢用费曼学习法来解释这些概念。虽然这些话不专业,可能会误导你,但可以让你快速大致了解这个东西是干什么用的?等你以后能力提升了,自然就会明白它的深层次道理。------作为一个被雨淋过的人,我想为同样在雨天行走的人撑一把伞。这是我博客的概念。希望能对那些走在前路的初学者有所帮助。首先我们要知道什么是Ajax?它不是一个具体的方法,(不要以为是Ajax(){})更像是一个概念和思想。A:Asynchronous异步ja:javaScriptjsx:XMLExtensible(可扩展)标记语言比如你正在看一本书的网页,你想翻到下一页,你会写一个a标签来提醒你用户翻页之前我们学到的知识,但是这样会浪费很多资源去刷新一些不必要的页面,比如顶部导航栏和页脚。但是,当我们点击这个链接的时候,整个页面会刷新一会,即使浏览器的处理速度很快,你的网速也够快了,但是因为用户关注的是文章中间的内容网页,如果我刷新一次,就意味着我必须回到网页顶部,用户体验非常糟糕。那我们是不是可以不刷新页面,直接修改文章内容呢?这就是Ajax的核心思想。比如我想点知乎上的某个评论,我不想点这个东西然后刷新我整个页面吧?(这个也可以用css布局,但是我们的主题是Ajax)那么我的思路是,当用户点击这个按钮的时候,我在页面中添加一个div,div的内容就是评论信息。div说起来容易,dom的很多方法都可以完成,那么重点是我怎么获取这些注释的内容呢?这里我们将使用XMLHttpRequset对象,它充当浏览器客户端和服务器之间的中间件,中间件。以前我们的请求方法比如tag之类的其实都是浏览器帮我们发送请求,但是有了xmlHttpRequset这个对象之后,我们写代码的时候就可以直接用js发送请求和处理数据了。1.XMLHttpRequest也是一个对象,对象中有很多方法,其中最有用的是open方法constxhr=newXMLHttpRequest();//构造函数,从XMLHttpRequest对象创建一个xhr实例2.有两个或者xhr的三种开启方式第一个参数是你打算用什么方式请求服务器获取数据,比如你去购物,可以使用微信、现金、支付宝购买,包括“GET”、“POST”、“SEND”,根据不同的使用场景切换使用。第二个参数是位于服务器端口的服务器文件内容,第三个参数是布尔值,有true和false选择是否异步发送请求。3.onreadystatechange从字面上看是xhr中的一个方法,就是当状态准备好改变的时候怎么办,准确的说是当你调用open方法后,服务器要给你发回数据的时候,你可以对数据进行pre-dosomesing那即将被归还。这时xhr对象中有个属性叫readyState(注意State的S是大写):0,1,2,3,4会被赋值,这四个状态会依次变化,从0到1、1到2、2到3、3到4。一共四个状态变化,3和4不是两者之一。0表示还没有开始。该属性的初始值为1表示open方法已开始调用并结束。2表示send()方法已完成运行。3表示服务器已发回一些数据。//到这一步,其实是可以操作数据的了,但是不通4表示已经把所有的数据都返回了作为第一个理解,到这里你就差不多明白什么是Ajax了。
