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代码
May 03 Javascript
js实现日历可获得指定日期周数及星期几示例分享(js获取星期几)
Mar 14 Javascript
jQuery之Deferred对象详解
Sep 04 Javascript
javascript关于open.window子页面执行完成后刷新父页面的问题分析
Apr 27 Javascript
简介JavaScript中fixed()方法的使用
Jun 08 Javascript
JS实现简单易用的手机端浮动窗口显示效果
Sep 07 Javascript
ES6 javascript的异步操作实例详解
Oct 30 Javascript
详解从买域名到使用pm2部署node.js项目全过程
Mar 07 Javascript
vue 表单验证按钮事件交由父组件触发的方法
Dec 17 Javascript
微信小程序实现文字从右向左无限滚动
Nov 18 Javascript
jQuery选择器之层次选择器用法实例分析
Feb 19 jQuery
Vue实现浏览器打印功能的代码
Apr 17 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 执行系统外部命令 system() exec() passthru()
2009/08/11 PHP
PHP5中新增stdClass 内部保留类
2011/06/13 PHP
Admin generator, filters and I18n
2011/10/06 PHP
基于PHP+Ajax实现表单验证的详解
2013/06/25 PHP
php读取excel文件示例分享(更新修改excel)
2014/02/27 PHP
使用jQuery简化Ajax开发 Ajax开发入门
2009/10/14 Javascript
模拟select的代码
2011/10/19 Javascript
ToolTips JQEURY插件之简洁小提示框效果
2011/11/19 Javascript
各浏览器中querySelector和querySelectorAll的实现差异分析
2012/05/23 Javascript
Jquery 的outerHeight方法使用介绍
2013/09/11 Javascript
js 日期比较相关天数代码
2014/04/02 Javascript
javascript中解析四则运算表达式的算法和示例
2014/08/11 Javascript
JS实现点击按钮后框架内载入不同网页的方法
2015/05/05 Javascript
jquery-tips悬浮提示插件分享
2015/07/31 Javascript
浏览器兼容性问题大汇总
2015/12/17 Javascript
AngularJS实现在ng-Options加上index的解决方法
2016/11/03 Javascript
JS实现动态修改table及合并单元格的方法示例
2017/02/20 Javascript
Angular4如何自定义首屏的加载动画详解
2017/07/26 Javascript
基于vue.js组件实现分页效果
2018/12/29 Javascript
在Python中使用Neo4j数据库的教程
2015/04/16 Python
python实现上传下载文件功能
2020/11/19 Python
python实现大文本文件分割
2019/07/22 Python
python-视频分帧&多帧合成视频实例
2019/12/10 Python
Python基于pandas爬取网页表格数据
2020/05/11 Python
python 3.8.3 安装配置图文教程
2020/05/21 Python
使用html2canvas将页面转成图并使用用canvas2image下载
2019/04/04 HTML / CSS
使用html5新特性轻松监听任何App自带返回键的示例
2018/03/13 HTML / CSS
英国哈罗德园艺:Harrod Horticultural
2020/03/31 全球购物
本科生的职业生涯规划范文
2014/01/09 职场文书
大学生自助营养快餐店创业计划书
2014/01/13 职场文书
毕业自我评价
2014/02/05 职场文书
理想点亮人生演讲稿
2014/05/21 职场文书
送达通知书
2015/04/25 职场文书
创业计划书之外语培训班
2019/11/02 职场文书
eclipse创建项目没有dynamic web的解决方法
2021/06/24 Java/Android
Windows Server 2012 R2 磁盘分区教程
2022/04/29 Servers