ajax基础知识

ajax
js向服务器获取数据--无刷新更新数据

字符集编码:网页文件一般是UTF-8编码,少数是GB2312,
保存在服务器的文件字符编码要一致,否则读取文件容易出错

缓存:只有第一次读取文件时是从服务器获取,之后每次读取文件都是
在本地磁盘读取,若是需要重新读取,则可以关闭浏览器再重新打开.
阻止缓存:改变读取文件的URL

ajax读取静态数据

tips:

//防止缓存的方法
ajax('a.txt?t='+new Date.getTime(),fnSucc,fnFail)

---

ajax读取动态数据
将数据转化成js能够识别的格式:eval(str)/JSON.stringfy();
todo:DOM动态创建元素并且展示

---

ajax原理
结合form使用
get方式:数据放在url中,跟着网址一起传递
name=value&name=value.....

post:数据不会被提交到url中
查看network

区别:
get:通过网址 网址长度一般是4k-10k 容量小
安全性差 有缓存
post:通过http Content 容量大(2G)
安全性好一点(https) 无缓存

---

ajax原理
自己编写一个ajax
从服务器获取数据的步骤
1.创建一个ajax对象

var oAjax=new XMLHttpRequest();
//IE 
var oAjax=new ActiveXObject("Microsoft.XMLHTTP");

全局变量都是window的一个属性
在js中用没有定义变量---报错
用没有定义的属性-undefined

2.连接到服务器

ajax.open(方法,文件名,异步传输)
ajax.open("GET",'a.txt',true)

同步:事情一步一步来 异步:多个事情一起来

3.告诉服务器需要哪些东西(发送请求)

ajax.send();

4.接收返回值

ajax.onreadystatechange=function(){
	//浏览器和服务器进行到哪一步了
	if(ajax.readyState==4) {
	//内容读取成功
	  if(ajax.status==200){
			
		}
	} 
}

ajax.readyState的值

0 未初始化,还未调用open方法
1 载入,已经调用send()方法,正在发送请求
2 载入完成 send方法已经完成,已收到全部响应内容(原始数据)
3 解析 正在解析响应内容
4 完成 响应内容解析完成(不论失败成功是一样响应)可以在客户端调用了

自己写一个ajax框架

function ajax(url,fnSucc,fnFail){
	var oAjax=new XHRHttpRequest();
	oAjax.open("GET",url,true);
	oAjax.send();
	oAjax.onreadystatechange(){
		if(oAjax.readyState==4 && oAjax.status==200){
			fnSucc(oAjax.reponseText)
		}else{
			if(fnFail){
				fnFail(oAjax.status)
			}
		}
	}
}

---

ajax数据
xml(已淘汰,同样的文件xml量大于json) json

字符集:同一个网站中所有文件字符集相同