原生 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 相关文章推荐
自己整理的一个javascript日期处理函数
Oct 16 Javascript
JavaScript判断一个URL链接是否有效的实现方法
Oct 08 Javascript
js用Date对象处理时间实现思路及代码
Jan 31 Javascript
JS操作数据库的实例代码
Oct 17 Javascript
javascript如何创建表格(javascript绘制表格的二种方法)
Dec 10 Javascript
JavaScript与HTML的结合方法详解
Nov 23 Javascript
AngularJS 执行流程详细介绍
Aug 18 Javascript
微信小程序 Canvas增强组件实例详解及源码分享
Jan 04 Javascript
jQuery插件DataTables分页开发心得体会
Aug 22 jQuery
layui默认选中table的CheckBox复选框方法
Sep 19 Javascript
Vue.directive 实现元素scroll逻辑复用
Nov 29 Javascript
vue 使用post/get 下载导出文件操作
Aug 07 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
PHP编程与应用
2006/10/09 PHP
php 数组的一个悲剧?
2011/05/11 PHP
让CodeIgniter数据库缓存自动过期的处理的方法
2014/06/12 PHP
PHP创建多级目录的两种方法
2016/10/28 PHP
Yii框架小部件(Widgets)用法实例详解
2020/05/15 PHP
jQuery.extend 函数的详细用法
2012/06/27 Javascript
Extjs4 消息框去掉关闭按钮(类似Ext.Msg.alert)
2013/04/02 Javascript
js实现回放拖拽轨迹从过程上进行分析
2014/06/26 Javascript
javascript结合fileReader 实现上传图片
2015/01/30 Javascript
Jquery on方法绑定事件后执行多次的解决方法
2016/06/02 Javascript
jQuery使用deferreds串行多个ajax请求
2016/08/22 Javascript
利用jQuery实现打字机字幕效果实例代码
2016/09/02 Javascript
jQuery实现最简单的切换图效果【可兼容IE6、火狐、谷歌、opera等】
2016/09/04 Javascript
深入理解AngularJS中的ng-bind-html指令和$sce服务
2016/09/08 Javascript
jQuery插件ContextMenu自定义图标
2017/03/15 Javascript
angular或者js怎么确定选中ul中的哪几个li
2017/08/16 Javascript
微信小程序使用swiper组件实现类3D轮播图
2018/08/29 Javascript
解决vue点击控制单个样式的问题
2018/09/05 Javascript
JavaScript实现星级评价效果
2019/05/17 Javascript
Vue.js如何使用Socket.IO的示例代码
2019/09/05 Javascript
VUE 组件转换为微信小程序组件的方法
2019/11/06 Javascript
js实现移动端吸顶效果
2020/01/08 Javascript
从零使用TypeScript开发项目打包发布到npm
2020/02/14 Javascript
javascript实现贪吃蛇经典游戏
2020/04/10 Javascript
Python检测一个对象是否为字符串类的方法
2015/05/21 Python
基于Pandas读取csv文件Error的总结
2018/06/15 Python
Python发起请求提示UnicodeEncodeError错误代码解决方法
2020/04/21 Python
python matplotlib工具栏源码探析三之添加、删除自定义工具项的案例详解
2021/02/25 Python
Deichmann英国:德国鞋类零售商
2021/01/30 全球购物
学习雷锋倡议书
2014/04/15 职场文书
财务部绩效考核方案
2014/05/04 职场文书
博士给导师的自荐信
2015/03/06 职场文书
Nginx反向代理及负载均衡如何实现(基于linux)
2021/03/31 Servers
基于Go Int转string几种方式性能测试
2021/04/28 Golang
mysql使用instr达到in(字符串)的效果
2022/04/03 MySQL
golang用type-switch判断interface的实际存储类型
2022/04/14 Golang