ajax-1:基本实现原理

时间:2023-09-19 13:47:08

一.什么是Ajax?

Asynchronous JavaScript and XML(异步JavaScript和XML)

二.实现步骤

ajax-1:基本实现原理

3.Open方法

  三个参数的含义

  1、提交方式 Form-method

  2、提交地址 Form-action

  3、是否异步

    true异步:非阻塞模式 前面的代码不会影响后面代码的执行

    false同步:阻塞模式 前面的代码会影响后面代码的执行.比如:定时器,

    异步和同步的区别?什么时候用同步什么时候用异步?

     当后续的代码需要用到前面的东西的时候,需要用同步,不过同步用的少,因为完全可以通过事件回调处理,一般情况用异步.

4.等待服务器返回内容,请求状态监控

onreadystatechange事件:on ready ststechange
属性:
  1.readyState:
ajax工作状态.
    0   (初始化)还没有调用open()方法
    1 (载入)已调用send()方法,正在发送请求
    2 (载入完成)send()方法完成,已收到全部响应内容
    3 (解析)正在解析响应内容
    4 (完成)响应内容解析完成,可以在客户端调用了   2.responseText:ajax请求返回的内容就会被存放在这个属性中,不管传的是什么值,通过它得到的都是字符串.
    
3.如果请求一个不存在的页面就会弹出异常,所以需要有一个容错处理.利用服务器状态码:status

ajax-1:基本实现原理

    

三.好处

节省用户操作,时间,提高用户体验,减少数据请求,传输获取数据.

四.什么是表单

向服务器提交数据,比如:提交用户信息

action:提交到哪里;

method:提交方式:Get和Post

  Get和Post区别:

  get:把数据和值用"="号连接,如果有多个的话,那么他会把多个数据组合,用&&符号进行连接,然后把数据放到url?后面传到指定页面.提交到了后端,后端会相应的获取我们传递过去的值:因为会缓存,所以提交的内容会放在地址栏上,或者下拉列表也会有显示因为url长度限制的原因,我们不要通过get方式传递过多的数据.

  1.传输方式的区别:Get通过url地址传输,Post通过浏览器内部传输

  2.传输数据量:Get有数据量限制,每个浏览器都不同 Post理论上无限.get传的值是字符串类型,不能传递任何其他的类型,post可以传很多,比如文本类型,甚至二进制类型.

ajax-1:基本实现原理

五.后端数据的接收

$_GET - 通过URL传递给该脚本的变量的数组

$_POST - 通过HTTP POST方法(表单)传递给该脚本的变量的数组.

      前后台键名和传输方式必须一致

      数据传输方式

      数据获取方式

ajax-1:基本实现原理