第九天 博文

 

ajax 技术

ajax的基本组成

  Xhtml css
  javascript
  xml

  XMLHttpRequest (核心，ajax引擎，异步交互的对象)
 
ajax使用的基本步骤：

 1、初始化ajax引擎    readyState=0（刚建立）

 2、封装url（设定要请求的路径）

 3、打开ajax引擎（同步方式、异步的方式；本次传输使用get还是post） readyState = 1

 4、将要请求的信息通过引擎发送到服务器进行处理 readyState =2

 5、监听服务器返回给ajax引擎的处理状态   readyState =3 、4

 6、判断是否交互完毕，如果交互完毕则取出返回的数据
 
在使用ajax过程中

注意发送的内容中文乱码的问题？

原因：
   浏览器默认情况下，不会对我们的url进行编码，这样导致传递到服务器端有乱码
解决办法：

   对要发送的URL进行编码

   可以使用encodeURI(是uri)  注意不是 encodeURL  进行编码
   可以使用decodeURI()进行解码 

   
  
关于ajax请求部分封装重用的问题

 

为什么要进行封装？

 

1、使用ajax有6步，每次都写这6步比较麻烦？

2、代码的重复利用率很低，页面非常乱

 

解决办法：就是封装  重用

 

案例2：使用ajax+dom+php+mysql 实现多级联动（省市县）

   思路：
      1、建立一些空的下拉菜单

   2、先要初始化省份列表

   3、当我们选择省份时，显示该省对应所有的市，如果选择了市，则显示该市所有的县。
  
   实现1：使用innerHTML的方式 想select中插入内容（不兼容ie）
  
   实现2：
         1、修改服务器端返回的数据格式（text）

   2、客户端可以使用dom 、js数组进行解析

      然后通过 js向下拉菜单中增加选项
     
   实现3：1、修改服务器端返回的数据格式（json）

   2、客户端可以使用dom 、js数组进行解析

      然后通过对象，js向下拉菜单中增加选项