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 相关文章推荐
通过jquery实现tab标签浏览效果
Feb 20 Javascript
JS维吉尼亚密码算法实现代码
Nov 09 Javascript
Json对象替换字符串占位符实现代码
Nov 17 Javascript
JS实现点击按钮控制Div变宽、增高及调整背景色的方法
Aug 05 Javascript
js实现多图左右切换功能
Aug 04 Javascript
AngularJS验证信息框架的封装插件用法【w5cValidator扩展插件】
Nov 03 Javascript
javascript实现无法关闭的弹框
Nov 27 Javascript
Vue自定义指令详解
Jul 28 Javascript
vue基于viewer实现的图片查看器功能
Apr 12 Javascript
了解javascript中let和var及const关键字的区别
May 24 Javascript
在react-antd中弹出层form内容传递给父组件的操作
Oct 24 Javascript
node.js使用express-fileupload中间件实现文件上传
Jul 16 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 三维饼图的实现代码
2008/09/28 PHP
php启动时候提示PHP startup的解决方法
2013/05/07 PHP
php实现执行某一操作时弹出确认、取消对话框
2013/12/30 PHP
php简单实现批量上传图片的方法
2016/05/09 PHP
微信第三方登录(原生)demo【必看篇】
2017/05/26 PHP
JavaScript中两个感叹号的作用说明
2011/12/28 Javascript
JavaScript中的this关键字介绍与使用实例
2013/06/21 Javascript
JavaScript实现QueryString获取GET参数的方法
2013/07/02 Javascript
window.location不跳转的问题解决方法
2014/04/17 Javascript
jquery插件ajaxupload实现文件上传操作
2015/12/09 Javascript
javascript中类的定义方式详解(四种方式)
2015/12/22 Javascript
js实现动态显示时间效果
2017/03/06 Javascript
yarn的使用与升级Node.js的方法详解
2017/06/04 Javascript
node-sass安装失败的原因与解决方法
2017/09/04 Javascript
vue 运用mock数据的示例代码
2017/11/07 Javascript
JS运动改变单物体透明度的方法分析
2018/01/23 Javascript
新手入门js闭包学习过程解析
2019/10/08 Javascript
vuex存储token示例
2019/11/11 Javascript
js实现车辆管理系统
2020/08/26 Javascript
vue组件添加事件@click.native操作
2020/10/30 Javascript
python网络编程之文件下载实例分析
2015/05/20 Python
基于python3 OpenCV3实现静态图片人脸识别
2018/05/25 Python
python使用Matplotlib画饼图
2018/09/25 Python
在Qt5和PyQt5中设置支持高分辨率屏幕自适应的方法
2019/06/18 Python
python生成requirements.txt的两种方法
2019/09/18 Python
PyCharm刷新项目(文件)目录的实现
2020/02/14 Python
Python Mock模块原理及使用方法详解
2020/07/07 Python
教你如何用python操作摄像头以及对视频流的处理
2020/10/12 Python
canvas绘图按照contain或者cover方式适配并居中显示
2019/02/18 HTML / CSS
实用求职信范文分享
2013/12/25 职场文书
超市仓管员岗位职责
2014/04/07 职场文书
《泉水》教学反思
2014/04/11 职场文书
体现团队精神的口号
2014/06/06 职场文书
读《解忧杂货店》有感:请相信一切都是最好的安排
2019/11/07 职场文书
数据库之SQL技巧整理案例
2021/07/07 SQL Server
Mysql的Table doesn't exist问题及解决
2022/12/24 MySQL