JS笔记5-Ajax基础

Ajax基础

Ajax基础
概念：Ajax就是在不刷新页面的前提下，让js可以读取从服务器获得的数据。
服务器：略，配置属于自己的服务器程序 利用wamp

使用Ajax
-请求并显示静态TXT文件
ajax(url,fnSucc,fnFailed)
ps:放到服务器环境下的文件不能用中文命名

-字符集编码-这是一个非常低能，又确实经常造成麻烦的问题。。
所有编码最好保持一致。推荐utf-8

-缓存、阻止缓存
缓存的工作原理：根据url，来进行缓存。
解决缓存带来的困扰，可以让url即时改变。
?t=new Date().getTime()//时间戳

-动态数据：请求JS或（json）文件
所读取的东西都是字符串，
eval的使用 ：用于解析字符串。
对解析出的数组做循环

-ajax原理
局部刷新，取出并显示部分网页文件
get请求-url传递
post请求-看不见

 区别：
 1.get通过网址，post通过http Content
 2.get容量有限。
 3.get安全性非常差，post相对安全
 4.get有缓存，而post没有缓存。
 5.get获取数据，post向服务器传递信息

-编写ajax
四个步骤：
1.创建一个Ajax对象 new XMLHttpRequest()
2.连接到服务器 request.open(‘GET’,url,true)//三个参数
3.发送请求 request.send();//此处send没有参数
4.接受返回值 request.onreadystatechange=function(){}//接收处理返回值。

创建一个新的请求对象（此处需要考虑兼容）
用应用数据配置请求对象，并发送到服务器
服务器使用请求对象向浏览器返回一个响应
相应调用相应代码

readystate是一个属性，它可以用来指示请求处于生命周期的哪一个阶段。

0(未初始化)还没有调用open()方法
1(连接初始化)已调用send()方法，请求已经准备好可以发送
2(请求正在处理)send()方法完成，服务器正在处理请求，2-3服务器会在不同时刻多次发回响应
3(得到服务器响应)数据下载到请求对象，但响应数据还没有完全准备好，正在解析响应内容
4(服务器响应准备就绪)响应内容解析完成，请求已经处理完成，数据可以使用了

request=creaeteRequest();
request.onreadystatechange=checked;//当服务器响应时调用哪一个函数
request.open(‘GET’,url,true);
request.send(null);

浏览器先解析工具代码，然后再解析可能调用这些工具代码的其他代码。
先使用公共代码，然后再应用特定代码

变量和属性。
全局变量window.a
报错和undefined的区别

同步应用-事情一件一件做，专心
异步应用-可以在做这个事的同时去处理一些别的事情

-Ajax成功返回的是文件的一个字符串str
eval()

function(str){
alert(str);
}
读取并创建（与DOM操作结合）
使用json