Ajax 数据请求的简单分析


Posted in Javascript onApril 05, 2011

比如:

function xmlHttpR(){ 
var xmlhttp; 
if(window.XMLHttpRequest){ 
xmlhttp=new XMLHttpRequest(); 
} 
else{ 
try{xmlhttp=new ActiveXObject("Msxml2.XMLHTTP")} 
catch(e){ 
try{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
catch(e){return null; 
} 
} 
return xmlhttp;

这样就基本上能创建一个跨浏览器的对象了;
下面是ajax的简单运用,利用XmlHttpRequest对象完成;
var ajaxEl=new Object(); 
//ajaxEl是自定义的命名空间; 
ajaxEl.contentLoad=function(url){ 
//IE浏览器下,会启用缓存,这里url加入date字段就是为了防止IE使用缓存,当然也可以使用Math.random()产生和getTime类似的效果; 
url+="?date="+new Date().getTime(); 
this.req=null; 
this.url=url; 
//这个回调函数就是在数据在页面上的更新函数; 
this.onload=function(){ 
//domEl是ID为#test的dom元素; 
var domEl=document.getElementById("test"); 
//除了用responseText属性,也可以使用responseXml获得一张数据表; 
domEl.innerHTML=this.req.responseText; 
} 
this.Xmlhttp(url); 
} 
ajaxEl.contentLoad.prototype={ 
Xmlhttp:function(url){ 
if(window.XMLHttpRequest){ 
this.req=new XMLHttpRequest(); 
} 
else{ 
try{this.req=new ActiveXObject("Msxml2.XMLHTTP")} 
catch(e){ 
try{this.req=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
catch(e){return null; 
} 
} 
} 
if(this.req){ 
var xmlR=this; 
this.req.onreadystatechange=function(){ 
if(xmlR.req.readyState===4){ 
xmlR.onload.call(xmlR); 
} 
} 
this.req.open("GET",url,true); 
this.req.send(null); 
} 
} 
} 
var xmlE=new ajaxEl.contentLoad("main.php");

main.php里面,我这里设置的比较简单的示例代码:在页面上就会显示一个类似:now! time is:05:18:10 am 2011,这样可动态变化的时间。
echo "now! time is:".date("H:i:s a Y");
Javascript 相关文章推荐
JavaScript.The.Good.Parts阅读笔记(二)作用域&闭包&减缓全局空间污染
Nov 16 Javascript
jQuery自定义事件的简单实现代码
Jan 27 Javascript
使用JavaScript的AngularJS库编写hello world的方法
Jun 23 Javascript
jQuery实现仿新浪微博浮动的消息提示框(可智能定位)
Oct 10 Javascript
jQuery针对input的class属性写了多个值情况下的选择方法
Jun 03 Javascript
通过构造函数实例化对象的方法
Jun 28 Javascript
Vue基于NUXT的SSR详解
Oct 24 Javascript
vue router-link传参以及参数的使用实例
Nov 10 Javascript
在react中使用vuex的示例代码
Jul 30 Javascript
JavaScript实现随机点名程序
Mar 25 Javascript
vue 实现用户登录方式的切换功能
Apr 14 Javascript
JavaScript函数柯里化实现原理及过程
Dec 02 Javascript
jQuery1.5.1 animate方法源码阅读
Apr 05 #Javascript
jQuery的运行机制和设计理念分析
Apr 05 #Javascript
jQuery JSON的解析方式分享
Apr 05 #Javascript
jQuery 1.5 源码解读 面向中高阶JSER
Apr 05 #Javascript
基于jquery的动态创建表格的插件
Apr 05 #Javascript
基于jquery的合并table相同单元格的插件(精简版)
Apr 05 #Javascript
新鲜出炉的js tips提示效果
Apr 03 #Javascript
You might like
PHP中使用smarty生成静态文件的例子
2014/04/24 PHP
ThinkPHP模版引擎之变量输出详解
2014/12/05 PHP
PHP SPL标准库之接口(Interface)详解
2015/05/11 PHP
PHP中异常处理的一些方法整理
2015/07/03 PHP
基于thinkPHP框架实现留言板的方法
2016/10/17 PHP
详解php用curl调用接口方法,get和post两种方式
2017/01/13 PHP
laravel实现上传图片并在页面显示的例子
2019/10/14 PHP
符合W3C网页标准的iframe标签的使用方法
2007/07/19 Javascript
cloudgamer出品ImageZoom 图片放大效果
2010/04/01 Javascript
javascript实现div浮动在网页最顶上并带关闭按钮效果实例
2013/08/13 Javascript
判断iframe里的页面是否加载完成
2014/06/06 Javascript
浅谈Javascript数组的使用
2015/07/29 Javascript
使用Function.apply()的参数数组化来提高 JavaScript程序性能的技巧
2015/12/23 Javascript
浅析AngularJs HTTP响应拦截器
2015/12/28 Javascript
Three.js如何实现雾化效果示例代码
2017/09/27 Javascript
解析vue data不可以使用箭头函数问题
2018/07/03 Javascript
微信小程序使用wxParse解析html的方法教程
2018/07/06 Javascript
layui框架table 数据表格的方法级渲染详解
2018/08/19 Javascript
Vue.js的动态组件模板的实现
2018/11/26 Javascript
vue微信分享到朋友圈 vue微信发送给好友
2018/11/28 Javascript
js图片查看器插件用法示例
2019/06/22 Javascript
JS使用正则表达式提交页面验证的代码
2019/10/16 Javascript
Python 图像处理: 生成二维高斯分布蒙版的实例
2019/07/04 Python
HTML5拖放API实现拖放排序的实例代码
2017/05/11 HTML / CSS
你的自行车健身专家:FaFit24
2016/11/16 全球购物
澳大利亚和新西兰最大的在线旅行社之一:Aunt Betty
2019/08/07 全球购物
彪马法国官网:PUMA法国
2019/12/15 全球购物
教研活动总结
2014/04/28 职场文书
2013年最新自荐信范文
2014/06/23 职场文书
企业法人代表证明书
2014/09/27 职场文书
人代会简报
2015/07/21 职场文书
2015中学教师个人工作总结
2015/07/22 职场文书
大学学习委员竞选稿
2015/11/20 职场文书
标准演讲稿格式结尾应该怎么书写?
2019/07/17 职场文书
SpringBoot+Redis实现布隆过滤器的示例代码
2022/03/17 Java/Android
HTML中link标签属性的具体用法
2023/05/07 HTML / CSS