原生 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 相关文章推荐
js href的用法
May 13 Javascript
jQuery代码优化 遍历篇
Nov 01 Javascript
js的2种继承方式详解
Mar 04 Javascript
一个简单的Node.js异步操作管理器分享
Apr 29 Javascript
jquery实现鼠标拖拽滑动效果来选择数字的方法
May 04 Javascript
java必学必会之static关键字
Dec 03 Javascript
js获取本机操作系统类型的两种方法
Dec 19 Javascript
node.js入门学习之url模块
Feb 25 Javascript
图片加载完成再执行事件的实例
Nov 16 Javascript
vue数据传递--我有特殊的实现技巧
Mar 20 Javascript
原生JS实现轮播图效果
Oct 12 Javascript
JavaScript实现公告栏上下滚动效果
Mar 13 Javascript
全面解析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
用Flash图形化数据(一)
2006/10/09 PHP
用PHP实现读取和编写XML DOM代码
2010/04/07 PHP
php web环境和命令行环境下查找php.ini的位置
2019/07/17 PHP
javascript replace方法与正则表达式
2008/02/19 Javascript
jQuery Clone Bug解决代码
2010/12/22 Javascript
JavaScript获取/更改文本框的值的实例代码
2013/08/02 Javascript
给文字加上着重号的JS代码
2013/11/12 Javascript
Javascript基础教程之argument 详解
2015/01/18 Javascript
js实现根据身份证号自动生成出生日期
2015/12/15 Javascript
nodejs发送http请求时遇到404长时间未响应的解决方法
2017/12/10 NodeJs
微信小程序实现全局搜索代码高亮的示例
2018/03/30 Javascript
vue底部加载更多的实例代码
2018/06/29 Javascript
详解小程序如何避免多次点击,重复触发事件
2019/04/08 Javascript
Vue数据双向绑定底层实现原理
2019/11/22 Javascript
解决父组件将子组件作为弹窗调用只执行一次created的问题
2020/07/24 Javascript
Node.js fs模块原理及常见用途
2020/10/22 Javascript
Vue toFixed保留两位小数的3种方式
2020/10/23 Javascript
[01:32]2016国际邀请赛中国区预选赛IG战队首日赛后采访
2016/06/27 DOTA
python抽取指定url页面的title方法
2018/05/11 Python
python输出决策树图形的例子
2019/08/09 Python
通过案例解析python鸭子类型相关原理
2020/10/10 Python
python代码实现猜拳小游戏
2020/11/30 Python
python wsgiref源码解析
2021/02/06 Python
CSS3中新增的对文本和字体的设置
2020/02/03 HTML / CSS
去加拿大的旅行和假期:Canadian Affair
2016/10/25 全球购物
德国拖鞋网站:German Slippers
2019/11/08 全球购物
小学生新年寄语
2014/04/03 职场文书
幼儿生日活动方案
2014/08/27 职场文书
2015年上半年物业工作总结
2015/03/30 职场文书
忠犬八公的故事观后感
2015/06/05 职场文书
2015年物流客服工作总结
2015/07/27 职场文书
女方家长婚礼致辞
2015/07/27 职场文书
职工的安全责任书范文!
2019/07/02 职场文书
创业计划书之青年旅馆
2019/09/23 职场文书
Python爬虫数据的分类及json数据使用小结
2021/03/29 Python
Win11运行cmd提示“请求的操作需要提升”的两种解决方法
2022/07/07 数码科技