前端开发装ajax-初级
摘要： 前端开发考虑的主流浏览器 前端开发主流浏览器差异 前端开发者浏览器 封装之前理解清楚get和post方式的区别 get：和url一起通过网址传递参数，安全性很低，容量小，会产生缓存，常用于取数据操作 pos……
| 前端开发考虑的主流浏览器 |
| 前端开发主流浏览器差异 |
| 前端开发者浏览器 |
封装之前理解清楚get和post方式的区别
get：和url一起通过网址传递参数，安全性很低，容量小，会产生缓存，常用于取数据操作
post：通过http content传递，容量可以达到2g，安全性比get会好一点，不会产生缓存，常用在上传数据操作上
开始简单封装：
[code]function ajax(url,fnSucc,fnFail){
if(window.XMLHttpRequest) //以属性的形式存在，在ie6下不会报错
{
var oAjax=new XMLHttpRequest();
}
//ie6下，通过微软提供的插件
else
{
var oAjax=new ActiveXobject(“Microsoft.XMLHttp”);
}
//链接服务器 open(方法，文件名，异步传输)
oAjax.open('get',url,true);
//发送请求
oAjax.send();
//接受返回信息
//和服务器有交互时发生
oAjax.onreadystatechange=function(){
//oAjax.readyState为交互状态
//0：初始化；1：载入 2：载入完成 3：解析 4：完成
if(oAjax.readyState==4){ //当解析完成时
if(oAjax.status==200) //200为成功状态
{ //成功时
fnSucc(oAjax.responseText);
}
else
{
if(fnFail){
fnFail(oAjax.status);
}
}
}
}
}[/code]前台测试，新建个aa.txt文件在同级目录下
前台html：
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>无标题文档</title>
<script type=”text/javascript” src=”Ajax.js”></script>
<script>
/
1,创建对象
2,链接服务器
3,发送请求
4,返回数据
/
window.onload=function(){
var oBtn=document.getElementById(‘obtn’);
oBtn.onclick=function(){
ajax('aa.txt',function(str){
alert(str)
})
}
}</script>
</head>
<body>
<input type=”button” id=”obtn” value=”ajax”/>
</body>
</html>
| 手机浏览器 前端开发 |
| 前端开发所用测试浏览器 |
| 前端开发用那个浏览器 |
近期评论