原生 JS Ajax,GET和POST 请求实例代码


Posted in Javascript onJune 08, 2016

javascript/js的ajax的GET请求代码如下所示:

<script type="text/javascript"> 
/* 创建 XMLHttpRequest 对象 */ 
var xmlHttp; 
function GetXmlHttpObject(){ 
if (window.XMLHttpRequest){ 


// code for IE7+, Firefox, Chrome, Opera, Safari 


xmlhttp=new XMLHttpRequest(); 

}else{// code for IE6, IE5 


xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 

} 

return xmlhttp; 
} 
// -----------ajax方法-----------// 
function getLabelsGet(){ 

xmlHttp=GetXmlHttpObject(); 

if (xmlHttp==null){ 


alert('您的浏览器不支持AJAX!'); 


return; 

} 

var id = document.getElementById('id').value; 

var url="http://www.Leefrom.com?id="+id+"&t/"+Math.random(); 

xmlHttp.open("GET",url,true); 

xmlHttp.onreadystatechange=favorOK;//发送事件后,收到信息了调用函数 

xmlHttp.send(); 
}
function getOkGet(){ 

if(xmlHttp.readyState==1||xmlHttp.readyState==2||xmlHttp.readyState==3){ 


// 本地提示:加载中 

} 

if (xmlHttp.readyState==4 && xmlHttp.status==200){ 


var d= xmlHttp.responseText; 


// 处理返回结果 

} 
} 
</script>

javascript/js的ajax的POST请求:

<script type="text/javascript"> 
/* 创建 XMLHttpRequest 对象 */ 
var xmlHttp; 
function GetXmlHttpObject(){ 
if (window.XMLHttpRequest){ 
// code for IE7+, Firefox, Chrome, Opera, Safari 
xmlhttp=new XMLHttpRequest(); 
}else{// code for IE6, IE5 
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
return xmlhttp; 
} 
// -----------ajax方法-----------// 
function getLabelsPost(){ 
xmlHttp=GetXmlHttpObject(); 
if (xmlHttp==null){ 
alert('您的浏览器不支持AJAX!'); 
return; 
} 
var url="http://www.lifefrom.com/t/"+Math.random(); 
xmlhttp.open("POST",url,true); 
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); 
xmlhttp.send(); 
xmlHttp.onreadystatechange=getLabelsOK;//发送事件后,收到信息了调用函数 
} 
function getOkPost(){ 
if(xmlHttp.readyState==1||xmlHttp.readyState==2||xmlHttp.readyState==3){ 
// 本地提示:加载中/处理中 
} 
if (xmlHttp.readyState==4 && xmlHttp.status==200){ 
var d=xmlHttp.responseText; // 返回值 
// 处理返回值 
} 
} 
</script>

注意:XMLHttpRequest 是 AJAX 的基础,在创建 XMLHttpRequest 对象时,必须与你写的ajax方法在同一个‘<script></script>'标签中!否则ajax请求会出错,并无法返回数据。 javascript/js的ajax的POST/GET请求。

以上所述是小编给大家介绍的原生 JS Ajax,GET和POST 请求实例代码的相关知识,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery.bgiframe.js在IE9下提示INVALID_CHARACTER_ERR错误
Jan 11 Javascript
jquery绑定事件不生效的解决方法
Feb 11 Javascript
JavaScript实现的购物车效果可以运用在好多地方
May 09 Javascript
extjs每个组件要设置唯一的ID否则会出错
Jun 15 Javascript
JavaScript中String.prototype用法实例
May 20 Javascript
JS禁止查看网页源代码的实现方法
Oct 12 Javascript
基于jQuery和Bootstrap框架实现仿知乎前端动态列表效果
Nov 09 Javascript
在vue中动态添加class类进行显示隐藏实例
Nov 09 Javascript
javascript实现超好看的3D烟花特效
Jan 01 Javascript
Node.js web 应用如何封装到Docker容器中
Sep 01 Javascript
小程序实现录音功能
Sep 22 Javascript
vue-cli中实现响应式布局的方法
Mar 02 Vue.js
全面解析jQuery $(document).ready()和JavaScript onload事件
Jun 08 #Javascript
jQuery提示插件qTip2用法分析(支持ajax及多种样式)
Jun 08 #Javascript
JavaScript中两个字符串的匹配
Jun 08 #Javascript
AngularJs学习第五篇从Controller控制器谈谈$scope作用域
Jun 08 #Javascript
jQuery购物车插件jsorder用法(支持后台处理程序直接转换成DataTable处理)
Jun 08 #Javascript
玩转JavaScript OOP - 类的实现详解
Jun 08 #Javascript
Javascript之String对象详解
Jun 08 #Javascript
You might like
php基础知识:类与对象(3) 构造函数和析构函数
2006/12/13 PHP
php+ajax实现无刷新文件上传功能(ajaxuploadfile)
2018/02/11 PHP
javascript基于jQuery的表格悬停变色/恢复,表格点击变色/恢复,点击行选Checkbox
2008/08/05 Javascript
网页中CDATA标记的说明
2010/09/12 Javascript
Javascript中的String对象详谈
2014/03/03 Javascript
js使用正则实现ReplaceAll全部替换的方法
2014/07/18 Javascript
jQuery使用之设置元素样式用法实例
2015/01/19 Javascript
ECMAScript 5严格模式(Strict Mode)介绍
2015/03/02 Javascript
js+jquery常用知识点汇总
2015/03/03 Javascript
前端弹出对话框 js实现ajax交互
2016/09/09 Javascript
BootStrap下拉菜单和滚动监听插件实现代码
2016/09/26 Javascript
Bootstrap Table使用整理(三)
2017/06/09 Javascript
angularjs自定义过滤器demo示例
2019/08/24 Javascript
vue+element tabs选项卡分页效果
2020/06/29 Javascript
JavaScript中Object、map、weakmap的区别分析
2020/12/15 Javascript
Python中实现字符串类型与字典类型相互转换的方法
2014/08/18 Python
python结合selenium获取XX省交通违章数据的实现思路及代码
2016/06/26 Python
利用python3随机生成中文字符的实现方法
2017/11/24 Python
Python Paramiko模块的使用实际案例
2018/02/01 Python
python 字典修改键(key)的几种方法
2018/08/10 Python
Flask配置Cors跨域的实现
2019/07/12 Python
python的faker库用法
2019/11/28 Python
pytorch 图像中的数据预处理和批标准化实例
2020/01/15 Python
python3实现raspberry pi(树莓派)4驱小车控制程序
2020/02/12 Python
Python类中self参数用法详解
2020/02/13 Python
python-sys.stdout作为默认函数参数的实现
2020/02/21 Python
Python 利用OpenCV给照片换底色的示例代码
2020/08/03 Python
以太网Ethernet IEEE802.3
2013/08/05 面试题
文秘专业个人求职信
2013/12/22 职场文书
爱情保证书范文
2014/02/01 职场文书
《周恩来的四个昼夜》观后思想汇报范文两篇
2014/09/10 职场文书
国庆节演讲稿范文2014
2014/09/19 职场文书
关于学习的决心书
2015/02/05 职场文书
证婚人致辞精选
2015/07/28 职场文书
职工趣味运动会开幕词
2016/03/04 职场文书
市场营销计划书
2019/04/24 职场文书