使用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 相关文章推荐
JavaScript 浮点数运算 精度问题
Oct 06 Javascript
jQuery对象[0]是什么含义?
Jul 31 Javascript
javascript设计模式之中介者模式Mediator
Dec 30 Javascript
jQuery学习笔记之创建DOM元素
Jan 19 Javascript
谈谈AngularJs中的隐藏和显示
Dec 09 Javascript
bootstrap下拉列表与输入框组结合的样式调整
Oct 08 Javascript
详解Sea.js中Module.exports和exports的区别
Feb 12 Javascript
jQuery validata插件实现方法
Jun 25 jQuery
微信小程序返回多级页面的实现方法
Oct 27 Javascript
webpack-dev-server自动更新页面方法
Feb 22 Javascript
Vue基本使用之对象提供的属性功能
Apr 30 Javascript
JS绘图Flot如何实现动态可刷新曲线图
Oct 16 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
屏蔽浏览器缓存另类方法
2006/10/09 PHP
php采用curl实现伪造IP来源的方法
2014/11/21 PHP
PHP5.3新特性小结
2016/02/14 PHP
PHP5.4起内置web服务器使用方法
2016/08/09 PHP
PHP机器学习库php-ml的简单测试和使用方法
2017/07/14 PHP
Laravel模型事件的实现原理详解
2018/03/14 PHP
laravel框架中控制器的创建和使用方法分析
2019/11/23 PHP
JavaScript(JS) 压缩 / 混淆 / 格式化 批处理工具
2010/12/10 Javascript
基于Jquery的淡入淡出的特效基础练习
2010/12/13 Javascript
JavaScript数组函数unshift、shift、pop、push使用实例
2014/08/27 Javascript
PHP+jQuery+Ajax实现多图片上传效果
2015/03/14 Javascript
JavaScript调用客户端Java程序的方法
2015/07/27 Javascript
基于jquery css3实现点击动画弹出表单源码特效
2015/08/31 Javascript
JavaScript实现斗地主游戏的思路
2016/02/29 Javascript
完美解决jQuery 鼠标快速滑过后,会执行多次滑出的问题
2016/12/08 Javascript
JavaScript与JQUERY获取元素的宽、高和位置
2017/02/26 Javascript
详解React Native顶|底部导航使用小技巧
2017/09/14 Javascript
浅谈vue-router 路由传参的方法
2017/12/27 Javascript
浅谈super-vuex使用体验
2018/06/25 Javascript
基于aotu.js实现微信自动添加通讯录中的联系人功能
2020/05/28 Javascript
在Echarts图中给坐标轴加一个标识线markLine
2020/07/20 Javascript
python获取从命令行输入数字的方法
2015/04/29 Python
使用Python抓取豆瓣影评数据的方法
2018/10/17 Python
Python通过4种方式实现进程数据通信
2020/03/12 Python
python 弧度与角度互转实例
2020/04/15 Python
Jupyter notebook快速入门教程(推荐)
2020/05/18 Python
python爬虫scrapy框架的梨视频案例解析
2021/02/20 Python
HTML5的结构和语义(2):结构
2008/10/17 HTML / CSS
阿迪达斯奥地利官方商城:adidas.at
2016/10/16 全球购物
Schutz鞋官方网站:Schutz Shoes
2017/12/13 全球购物
Nike爱尔兰官方网站:Nike.com (IE)
2018/03/12 全球购物
房屋租赁授权委托书范本
2014/09/20 职场文书
英语感谢信范文
2015/01/20 职场文书
六一晚会主持词开场白
2015/05/28 职场文书
python实现简单的井字棋
2021/05/26 Python
vue 数字翻牌器动态加载数据
2022/04/20 Vue.js