学习笔记--Ajax

发布时间：2020-12-16 00:35:30 所属栏目：百科来源：网络整理

导读：什么是Ajax 无刷新数据读取用户注册、在线聊天室异步、同步使用Ajax 基础：请求并显示静态TXT文件字符集编码缓存、阻止缓存动态数据：请求JS（或json）文件（ajax得到的是字符串） eval的使用（把一个语句内容解析为JS可以识别的） DOM创建元素局部刷

什么是Ajax
无刷新数据读取
用户注册、在线聊天室
异步、同步
使用Ajax
基础：请求并显示静态TXT文件
字符集编码
缓存、阻止缓存
动态数据：请求JS（或json）文件（ajax得到的是字符串）
eval的使用（把一个语句内容解析为JS可以识别的）
DOM创建元素
局部刷新：请求并显示部分网页文件
Ajax原理
HTTP请求方法
GET----用于获取数据（如：浏览帖子）
POST----用于上传数据（如：用户注册）
GET、POST的区别
get:通过网址传递、网址长度有限容量小（上传图片等不行，不适合传递大数据）、安全性差、有缓存
post:通过http Content(不通过网址)、可以到达2G、没有缓存（每一次都提取新的数据）
get是在url里传数据：安全性、容量（？名字=值&名字=值）
缓存

HTTPS和HTTP的区别一、https协议需要到ca申请证书，一般免费证书很少，需要交费。
二、http是超文本传输协议，信息是明文传输，https 则是具有安全性的ssl加密传输协议。
三、http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。
四、http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。

编写Ajax
1.创建Ajax对象
ActiveXObject("Microsoft.XMLHTTP")
XMLHttpRequest()
2.连接服务器
open(方法，文件名，异步传输)
同步和异步(多件事可以一起来做，请求的同时可以执行页面其他操作)
3.发送请求
send()
4.接收返回值
请求状态监控
onreadystatechange事件
readyState属性：请求状态
0（未初始化）还没有调用open()方法
1（载入）已调用send()方法，正在发送请求
2（载入完成）send()方法完成，已收到全部响应内容(可能加密或压缩过，自己做解码，解压)
3（解析）正在解析响应内容
4（完成）响应内容解析完成，可以在客户端调用了
status属性：请求结果
responseText
数据类型
什么叫数据类型--英语、中文
XML（同等数据量比Json大很多）、Json
字符集
所有文件字符集相同（全统一为utf-8）

function ajax(url,fnSucc,fnFaild)
{
var oBtn=document.getElementById("btn1");
oBtn.onclick=function()
{
//1.创建Ajax对象
//非IE6
var oAjax;
if(window.XMLHttpRequest)//不会报错，只会是undefined
{oAjax=new XMLHttpRequest();}
else
//iE6 IE5
{oAjax=new ActiveXObject("Microsoft.XMLHTTP");}
//alert(oAjax);
//2.连接服务器
//open(方法,文件名,异步传输)
oAjax.open("get",url+"?t="+new Date().getTime(),true);//制止缓存
//3.发送请求
oAjax.send();
//4.接收返回值和服务器通讯的时候此事件发生
oAjax.onreadystatechange=function()
{
//oAjax.readyState //浏览器和服务器，进行到哪一步了
if(oAjax.readyState==4)//读取完成（可能文件不存在）
{
if(oAjax.status==200)//成功
{
fnSucc(oAjax.responseText);
//alert("成功"+oAjax.responseText);
}
else
if(fnFaild)//fnFaild传进来时
{
fnFaild(oAjax.status);
}
//alert("失败:"+oAjax.status);//status为404
}
}
}
}

复制代码

<script>
window.onload=function(){
var oBtn=document.getElementById("btn1");
oBtn.onclick=function()
ajax("a.txt",function(str){alert(str)})
}
</script

复制代码

转载： http://www.w3cfuns.com/blog-5442494-5398026.html

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!