<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Untitled Page</title>
<script type="text/javascript" src="jquery-3.2.1.js"></script>
<script type="text/javascript">
function ajax(parm){
//创建ajax对象
var xhr = null;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xhr = ActiveXObject('Microsoft.XMLHTTP')
}
//回调函数
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
var result = xhr.responseText;//只考虑json格式
// var use = JSON.parse(result);
if (parm.success='function'){
parm.success(result)
};
}else{
parm.erro()
};
}
}
if(parm.type=='get'){
var URL=parm.url +"?"+'key=value';
}
else if (parm.type=='post'){
xhr.setRequestHeader("Content-Type","application/x-www/form-urlencode");
};
xhr.open(type,URL,true);
xhr.send(null);
};
$(function(){
$("#btn").click(function(){
var parm1 = {
type:'get/post',
dataType:"xml/json",
url:'01data.php',//如果type=get则URL='URL?code='+value;data设置为null
data:{key:value},
success:function(use){
alert(use)
},
erro:function(){}
};
ajax(parm1);
})
})
</script>
</head>
<body>
<input type="button" id="btn" value="click">
<div id="show"></div>
</body>
</html>
</body>
</html>
原生ajax封装
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 原生Ajax封装 http://www.jianshu.com/p/ff9e1139ea51 jQuery-Aja...
- AJAX: XMLHttpRequest是AJAX的基础 1.创建一个XMLHttpRequest对象: 2.用X...