网站模板库
  • 首页
  • web前端工具
    • HTML/JS转换工具
    • JS/HTML格式化工具
    • 字母/英文大小写转换工具
    • robots.txt文件生成工具
    • Js压缩/格式化工具
    • Css在线压缩工具_代码格式化
  • 关于我们
    • 免责声明
    • 联系我们
    • 广告服务
    • 服务项目
    • 关于我们
    • 网站轮播
    • 公告
    • 成都优优科技专用
    • 按行业分类
  • web学院
    • 服务器教程
    • 学习资料
      • 基础书籍
      • 交互书籍
      • 入门教程
      • 特效分类
    • 案例分享
    • web资讯
  • 网页特效
    • 图片特效
    • 导航特效
    • 滑动按钮
    • 表单特效
    • 文字特效
    • 弹窗特效
    • 其他特效
  • 织梦模板
    • 科技/电子/数码/通信
    • 文化/艺术/广告/传媒
    • 装修/设计/家居/家具
    • 基建/施工/地产/物业
    • 餐饮/酒店/旅游/票务
    • 食品/果蔬/饮料/日用
    • 服饰/珠宝/礼品/玩具
    • 摄影/婚庆/家政/生活
    • 运动/健身/体育/器材
    • 学校/教育/培训/科研
    • 美容/保健/医院/医疗
    • 金融/财税/咨询/法律
    • 政府/组织/集团/协会
    • 汽车/物流/交通/搬运
    • 机械/设备/制造/仪器
    • 化工/环保/能源/材料
    • 农业/畜牧/养殖/宠物
    • 其他模版
    • IT/软件/信息/互联网
  • 手机模板
    • 手机APP模板
    • 微信小程序模板
    • wap
  • 网站模板
    • joomla模板
    • Drupal模板
    • z-blog模板
    • EyouCms模板
    • Bootstrap模板
    • 帝国cms模板
    • CmsEasy模板
    • MetInfo模板
    • 购物商城模板
      • Shopify主题
      • PrestaShop主题
    • 后台模板
    • 纯HTML模板
    • ecshop模板
    • phpwind模板
    • pbootcms模板
    • phpcms模板
    • wordpress模板
    • discuz模板
  • 教程
    • 织梦教程
    • Discuz教程
    • WordPress教程
    • Phpcms教程
    • Phpwind教程
    • ECShop教程
    • Joomla教程
    • Drupal教程
    • zblog教程
    • EyouCMS教程
    • 帝国cms教程
    • MetInfo教程
    • CmsEasy教程
登录
当前位置:网站模板库 > web学院 > 服务器教程 > ajax是什么?ajax的交互模型?ajax跨域的解决办法
商业源码 服务器教程 2024-01-15 14:20:01

ajax是什么?ajax的交互模型?ajax跨域的解决办法

ajax是什么?ajax的交互模型?ajax跨域的解决办法,第1张

AJAX = 异步 JavaScript 和 XML。

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

通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。

同步:脚本会停留并等待服务器发送回复然后再继续

  异步:脚本允许页面继续其进程并处理可能的回复

ps(交互模型就是Ajax在Browser端引入一个执行引擎,它一边应付user的请求,一边把某些必须交给服务器处理的东西背地里传送给服务器,同时背地里把结果准备好(接受服务器端的数据),展现给客户的技术模式。Ajax增强了用户的操作性。

而同步就是整个页面都刷新,异步就是只刷新用了Ajax技术的部分)

  跨域问题简单的理解就是因为JS同源策略的限制,acom域名下的JS无法操作bcom或cacom下的对象

http://blogsinacomcn/s/blog_49fa034d0101gg49html

ajax请求的五个步骤如下

步骤如下五个步骤

1创建异步对象,首先,创建一个XMLHttpRequest异步对象。

2设置请求方式和地址,然后,设置请求方式和请求地址

3用send发送请求,接着,用send发送请求。

4监听状态变化,然后,监听状态变化。

5接收返回的数据,最后,接收返回的数据

ajax是服务器端的语言!

如果你按照磁盘路径浏览,他把它当作了html来解释!

iis浏览,也就是http://127001/ajax/helloworldhtm

iis是web服务器,他会把服务器语言解释转换为客户端程序,这样浏览器就能够理解它的正确命令了

Ajax(Asynchronous java and xml)就是异步JavaScript和XML包括:1使用XHTML和CSS标准化呈现;2使用DOM实现动态显示和交互;3使用XML和XSLT进行数据的交换和处理;4使用XMLHttpRequest进行异步的数据读取;5最后的JavaScript绑定和数据的处理所有数据;

(一) 关于 XMLHttpRequest对象

在使用这个对象向服务器端发送请求以及处理响应之前,要在JavaScript中创建一个该对象,然后通过这个对象来和服务器建立请求并接收服务器返回的数据因此创建之前还必须进行浏览器的判断看他是否支持ActiveX对象,如果不支持,则可以采用本地的JavaScript来创建

下面是个创建XMLHttpRequest对象的例子:

var req;

function createRequest(){

if(windowActiveXObject){ //进行判断了,TRUE代表有ActiveX对象

req=new ActiveXObject("MicrosoftXMLHTTP");//进行判断了,TRUE代表有ActiveX对象

}

else if(windowXMLHttpRequest){

req=new XMLHttpRequest();

}

}

XMLHttpRequest发送请求的过程如下:

1.创建一个XMLHttpRequest对象;

2.为这个对象指定一个函数,来处理这个对象的状态变化.方法是设置这个对象的onreadystatechange属性,将某个函数付给这个属性就可以了;

3.建立一个连接,XMLHttpRequest的open()方法会和服务器建立一个连接.

4.向服务器发送请求,send()方法会把请求发送到指定的URL;

例子如下:

function sendRequest(callback,url){

if(windowXMLHttpRequest){

req=new XMLHttpRequest();

reqonreadystatechange=callback;

reqopen("GET",urltrue);

reqsend(null);

}

else if (windowActiveXObject){

req=new ActiveXObject("MicrosoftXMLHTTP");

if(req){

reqonreadystatechange=callback;

reqopen("GET",urltrue);

reqsend(null);

}

}

}

ajax是一种技术方案,但并不是一种新技术。它依赖的是现有的CSS/HTML/JavaScript,而其中最核心的依赖就是浏览器提供的XMLHttpRequest对象,是这个对象使得浏览器可以发出HTTP请求与接收HTTP响应,实现在页面不刷新的情况下和服务端进行数据交互。浏览器升级之后,出现了fetch,也可以认为是ajax的一种实现。(兼容性差)

使用XMLHttpRequest对象来发送一个Ajax请求。

status:200-300表示正常状态码。

status:404表示这个文件不存在。

status:503服务器收到了请求但是内部报错了。

status:304表示这个数据是有缓存的。

readyState:存有XMLHttpRequest的状态。从0~4发生变化

只要readyState属性的值由一个值变成另一个值,都会触发一次readystatechange事件。必须在调用open()之前指定onreadystatechange事件处理程序才能保证跨浏览器兼容性。与其他事件不同的是,这里没有向readystatechange事件处理程序中传递event对象,必须通过XHR对象本身来确定下一步该怎么做。

在接受响应之前,还可以调用abort()方法来取消异步请求,

调用这个方法之后,XHR对象会停止触发事件,而且也不在允许访问任何与响应有关的对象属性。

XMLHttpRequest标准又分为Level 1和Level 2。

1缺点:

此属性可以设置HTTP请求的时限。与之相关的是timeout()事件,用来指定回调函数。

timeout属性表示请求在等待多少毫秒之后就终止,再给timeout设置一个数值后,如果在规定的时间内浏览器还没有接收到响应,那么就会触发timeout事件,进而会调用ontimeout事件处理程序。如果在超时终止请求之后再访问status属性,就会导致错误。为避免浏览器报告错误,可以将检查status属性的语句封装在一个try-catch语句中。

ajax直接传送FormData对象与点击submit提交网页表单的效果是一样的。

使用FormData的优点:不必明确地在XHR对象上设置请求头部,XHR能够识别传入的数据类型是FormData的实例,并配置适当的头部信息。

假定files是一个"选择文件"的表单元素(input[type="file"]),将它装入FormData对象,之后发送FormData即可实现文件的上传。

作用:指定xhrresponse的数据类型。

作用:获取response数据

作用:表示发送数据。

xhrsend(data)的参数data可以是以下几种类型:

阮一峰:XMLHttpRequest Level 2 使用指南

你真的会使用XMLHttpRequest么?

《javascript高级程序设计》

饥人谷前端教程

ASPAJAXExtSetupmsi

这个是vs里面的ajax扩展程序,安装以后可接结合vs开发ajax,里面是很多ajax的控件,在官方网站上http://wwwaspnet/ajax/downloads/上进行下载

vs2005 下载 ASPNET AJAX Control Toolkit

vs2008 下载 Microsoft AJAX Library 35

ajax for net 20还有一个增强组建包AjaxControlToolkit-NoSourcezip

也可以在官方下载,有两个,一个是有事例的,一个只是纯文件

不过应用ajax控件开发的程序,在服务器上必须安装有相应的ajax扩展程序,不然程序无法运行,所以我的简易是直接学习ajax,自己开发,这个就不用被微软说限制,而且网上也有很多ajax的源代码可以进行参考

ajax 是js编写的,而js又是解析性的脚本语言,根本不用安装,网上好多ajax 的框架,你可以去看看

http://topiccsdnnet/u/20070928/16/103e0129-aade-4849-b425-cb66ce1bd1e3htmlseed=2014340929

对象 异步 数据 服务器 属性
DABAN RP主题是一个优秀的主题,极致后台体验,无插件,集成会员系统
网站模板库 » ajax是什么?ajax的交互模型?ajax跨域的解决办法

商业源码 钻石

分享到:
上一篇
电脑配好的DNS服务器地址总是自动被更改
下一篇
服务器和普通的电脑机箱有什么区别?

相关推荐

美国现在用微信用翻墙吗

美国现在用微信用翻墙吗

浪潮服务器nf5270m3这个型号的服务器能在bios里设置风扇转速吗,大神,方

浪潮服务器nf5270m3这个型号的服务器能在bios里设置风扇转速吗,大神,方

我需要为公司建立一个网站有哪些费用?

我需要为公司建立一个网站有哪些费用?

linux系统时钟同步命令

linux系统时钟同步命令

0条评论

发表评论 取消回复

要发表评论,您必须先登录。

提供最优质的资源集合

立即查看 了解详情
网站模板库

主题/付费下载/查看/余额管理/自定义积分,集成支付,卡密,推广奖励等。

本站导航
  • 链接标题
友情链接
  • 链接标题
快速搜索
本站由钛宇宙强力驱动
友情链接:
    商业源码网蜀ICP备2023005044号
    网站模板库
    • 登录
    • 注册
    网站模板库
    • 首页
    • web前端工具►
      • HTML/JS转换工具
      • JS/HTML格式化工具
      • 字母/英文大小写转换工具
      • robots.txt文件生成工具
      • Js压缩/格式化工具
      • Css在线压缩工具_代码格式化
    • 关于我们►
      • 免责声明
      • 联系我们
      • 广告服务
      • 服务项目
      • 关于我们
      • 网站轮播
      • 公告
      • 成都优优科技专用
      • 按行业分类
    • web学院►
      • 服务器教程
      • 学习资料►
        • 基础书籍
        • 交互书籍
        • 入门教程
        • 特效分类
      • 案例分享
      • web资讯
    • 网页特效►
      • 图片特效
      • 导航特效
      • 滑动按钮
      • 表单特效
      • 文字特效
      • 弹窗特效
      • 其他特效
    • 织梦模板►
      • 科技/电子/数码/通信
      • 文化/艺术/广告/传媒
      • 装修/设计/家居/家具
      • 基建/施工/地产/物业
      • 餐饮/酒店/旅游/票务
      • 食品/果蔬/饮料/日用
      • 服饰/珠宝/礼品/玩具
      • 摄影/婚庆/家政/生活
      • 运动/健身/体育/器材
      • 学校/教育/培训/科研
      • 美容/保健/医院/医疗
      • 金融/财税/咨询/法律
      • 政府/组织/集团/协会
      • 汽车/物流/交通/搬运
      • 机械/设备/制造/仪器
      • 化工/环保/能源/材料
      • 农业/畜牧/养殖/宠物
      • 其他模版
      • IT/软件/信息/互联网
    • 手机模板►
      • 手机APP模板
      • 微信小程序模板
      • wap
    • 网站模板►
      • joomla模板
      • Drupal模板
      • z-blog模板
      • EyouCms模板
      • Bootstrap模板
      • 帝国cms模板
      • CmsEasy模板
      • MetInfo模板
      • 购物商城模板►
        • Shopify主题
        • PrestaShop主题
      • 后台模板
      • 纯HTML模板
      • ecshop模板
      • phpwind模板
      • pbootcms模板
      • phpcms模板
      • wordpress模板
      • discuz模板
    • 教程►
      • 织梦教程
      • Discuz教程
      • WordPress教程
      • Phpcms教程
      • Phpwind教程
      • ECShop教程
      • Joomla教程
      • Drupal教程
      • zblog教程
      • EyouCMS教程
      • 帝国cms教程
      • MetInfo教程
      • CmsEasy教程

      弹窗标题

      这是一条网站公告,可在后台开启或关闭,可自定义背景颜色,标题,内容,用户首次打开关闭后不再重复弹出,此处可使用html标签...