原生 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 数组的for循环到底应该怎么写?
May 31 Javascript
js 判断一个元素是否在页面中存在
Dec 27 Javascript
JS截取字符串常用方法详细整理
Oct 28 Javascript
javascript圆盘抽奖程序实现原理和完整代码例子
Jun 03 Javascript
JS实现的生成随机数的4个函数分享
Feb 11 Javascript
JS获取及设置TextArea或input文本框选择文本位置的方法
Mar 24 Javascript
JS实现网页上随机产生超链接地址的方法
Nov 09 Javascript
收藏AngularJS中最重要的核心功能
Jul 09 Javascript
vue实现图片加载完成前的loading组件方法
Feb 05 Javascript
JS中的算法与数据结构之列表(List)实例详解
Aug 16 Javascript
vue项目里面引用svg文件并给svg里面的元素赋值
Aug 17 Javascript
js+canvas实现画板功能
Sep 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
ThinkPHP分组下自定义标签库实例
2014/11/01 PHP
thinkphp中memcache的用法实例
2014/11/29 PHP
PHP正则验证Email的方法
2015/06/15 PHP
实例分析PHP中PHPMailer发邮件
2017/12/13 PHP
Js 获取HTML DOM节点元素的方法小结
2009/04/24 Javascript
使用Javascript接收get传递的值的代码
2011/11/30 Javascript
jquery获得option的值和对option进行操作
2013/12/13 Javascript
jQuery事件之键盘事件(ctrl+Enter回车键提交表单等)
2014/05/11 Javascript
jQuery实现contains方法不区分大小写的方法
2015/02/13 Javascript
浅谈Javascript中Object与Function对象
2015/09/26 Javascript
莱鸟介绍window.print()方法
2016/01/06 Javascript
bootstrap网页框架的使用方法
2016/05/10 Javascript
javascript实现获取图片大小及图片等比缩放的方法
2016/11/24 Javascript
微信小程序使用template标签实现五星评分功能
2018/11/03 Javascript
微信小程序tabbar底部导航
2018/11/05 Javascript
一起写一个即插即用的Vue Loading插件实现
2019/10/31 Javascript
Js跳出两级循环方法代码实例
2020/09/22 Javascript
JS addEventListener()和attachEvent()方法实现注册事件
2021/01/11 Javascript
深度剖析使用python抓取网页正文的源码
2014/06/11 Python
再谈Python中的字符串与字符编码(推荐)
2016/12/14 Python
python获取网页中所有图片并筛选指定分辨率的方法
2018/03/31 Python
windows下python 3.6.4安装配置图文教程
2018/08/21 Python
pandas筛选某列出现编码错误的解决方法
2018/11/07 Python
Python对象转换为json的方法步骤
2019/04/25 Python
在Python中字符串、列表、元组、字典之间的相互转换
2019/11/15 Python
Pytorch之保存读取模型实例
2019/12/30 Python
python绘制玫瑰的实现代码
2020/03/02 Python
python GUI库图形界面开发之PyQt5信号与槽事件处理机制详细介绍与实例解析
2020/03/08 Python
在HTML5 canvas里用卷积核进行图像处理的方法
2018/05/02 HTML / CSS
PAUL HEWITT手表美国站:德国北部时尚生活配饰品牌,船锚元素
2017/11/18 全球购物
MySQL面试题
2014/01/12 面试题
初级党校心得体会
2014/09/11 职场文书
2014年办公室个人工作总结
2014/11/12 职场文书
储备店长岗位职责
2015/04/14 职场文书
单位车辆管理制度
2015/08/05 职场文书
详解nginx location指令
2022/01/18 Servers