使用JavaScript实现ajax的实例代码


Posted in Javascript onMay 11, 2016

AJAX = Asynchronous JavaScript and XML.

AJAX 是一种创建快速动态网页的技术。

AJAX 通过在后台与服务器交换少量数据的方式,允许网页进行异步更新。这意味着有可能在不重载整个页面的情况下,对网页的一部分进行更新。

实现ajax之前必须要创建一个 XMLHttpRequest 对象。如果不支持创建该对象的浏览器,则需要创建 ActiveXObject.具体方法如下:

var xmlHttp; 
function createxmlHttpRequest()
{ 
if (window.ActiveXObject) { 
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
else if 
(window.XMLHttpRequest)
{ 
xmlHttp=new XMLHttpRequest(); 
} 
}

(1)下面使用上面创建的xmlHttp实现最简单的ajax get请求:

function doGet(url)
{ 
// 注意在传参数值的时候最好使用encodeURI处理一下,以防出现乱码 
createxmlHttpRequest(); 
xmlHttp.open("GET",url); 
xmlHttp.send(null); 
xmlHttp.onreadystatechange = function()
{ 
if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) { 
alert('success'); 
} 
else 
{ 
alert('fail'); 
} 
} 
}

(2)使用上面创建的xmlHttp实现最简单的ajax post请求:

function doPost(url,data)
{ 
// 注意在传参数值的时候最好使用encodeURI处理一下,以防出现乱码 
createxmlHttpRequest(); 
xmlHttp.open("POST",url); 
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 
xmlHttp.send(data); 
xmlHttp.onreadystatechange = function() 
{ 
if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) 
{ 
alert('success'); 
}
else
{ 
alert('fail'); 
} 
} 
}

以上内容是小编给大家介绍的JavaScript实现ajax的实例代码,希望对大家有所帮助,在使用过程发现有任何疑问欢迎给我留言,小编会及时回复大家的。在此小编非常感谢大家对三水点靠木网站的支持,相信我们会做的更好!

Javascript 相关文章推荐
神奇的代码 通杀各种网站-可随意修改复制页面内容
Jul 17 Javascript
javascript实现阻止iOS APP中的链接打开Safari浏览器
Jun 12 Javascript
js实现鼠标悬浮给图片加边框的方法
Jan 30 Javascript
JavaScript基本数据类型及值类型和引用类型
Aug 25 Javascript
简单谈谈gulp-changed插件
Feb 21 Javascript
详解最新vue-cli 2.9.1的webpack存在问题
Dec 16 Javascript
Vue路由history模式解决404问题的几种方法
Sep 29 Javascript
在element-ui的select下拉框加上滚动加载
Apr 18 Javascript
浅谈对于“不用setInterval,用setTimeout”的理解
Aug 28 Javascript
layui下拉框获取下拉值(select)的例子
Sep 10 Javascript
Vue页面切换和a链接的本质区别详解
Nov 12 Javascript
Vue.js实现大屏数字滚动翻转效果
Nov 29 Javascript
jQuery的框架介绍
May 11 #Javascript
jQuery链式调用与show知识浅析
May 11 #Javascript
[原创]Javascript 实现广告后加载 可加载百度谷歌联盟广告
May 11 #Javascript
Extjs4.0 ComboBox如何实现三级联动
May 11 #Javascript
javascript简单判断输入内容是否合法的方法
May 11 #Javascript
解析JavaScript面向对象概念中的Object类型与作用域
May 10 #Javascript
JavaScript根据CSS的Media Queries来判断浏览设备的方法
May 10 #Javascript
You might like
六酷社区论坛HOME页清新格调免费版 下载
2007/03/07 PHP
PHP合并数组+与array_merge的区别分析
2010/08/01 PHP
递归实现php数组转xml的代码分享
2015/05/14 PHP
PHP使用微信开发模式实现搜索已发送图文及匹配关键字回复的方法
2017/09/13 PHP
js同时按下两个方向键
2007/12/01 Javascript
不懂JavaScript应该怎样学
2008/04/16 Javascript
javascript 极速 隐藏/显示万行表格列只需 60毫秒
2009/03/28 Javascript
XHTML下,JS浮动代码失效的问题
2009/11/12 Javascript
safari,opera嵌入iframe页面cookie读取问题解决方法
2010/06/23 Javascript
jQuery后代选择器用法实例
2014/12/23 Javascript
JavaScript 学习笔记之变量及其作用域
2015/01/14 Javascript
jQuery获取checkboxlist的value值的方法
2015/09/27 Javascript
基于Javascript实现弹出页面效果
2016/01/01 Javascript
jQuery实现拖拽页面元素并将其保存到cookie的方法
2016/06/12 Javascript
基于JS实现9种不同的面包屑和分布式多步骤导航效果
2017/02/21 Javascript
基于javascript的异步编程实例详解
2017/04/10 Javascript
原生JS实现不断变化的标签
2017/05/22 Javascript
简单谈谈JS中的正则表达式
2017/09/11 Javascript
详解Vue路由History mode模式中页面无法渲染的原因及解决
2017/09/28 Javascript
Vue使用axios出现options请求方法
2019/05/30 Javascript
JavaScript编写开发动态时钟
2020/07/29 Javascript
angular *Ngif else用法详解
2020/12/15 Javascript
python对字典进行排序实例
2014/09/25 Python
Python中使用hashlib模块处理算法的教程
2015/04/28 Python
Python2.x版本中cmp()方法的使用教程
2015/05/14 Python
Python实现基于C/S架构的聊天室功能详解
2018/07/07 Python
详解python爬虫系列之初识爬虫
2019/04/06 Python
keras 使用Lambda 快速新建层 添加多个参数操作
2020/06/10 Python
Coccinelle官网:意大利的著名皮具品牌
2019/05/15 全球购物
网络教育毕业生自我鉴定
2013/10/10 职场文书
机械专业应届生求职信
2013/12/12 职场文书
房产委托公证书
2014/04/08 职场文书
骨干教师考核方案
2014/05/09 职场文书
2015年宣传部部长竞选演讲稿
2014/11/28 职场文书
Spring整合Mybatis的全过程
2021/06/28 Java/Android
Python查找算法的实现 (线性、二分,分块、插值查找算法)
2022/04/24 Python