(二)关于ajax那些事

哈哈,今天突然兴起,想了想自己对ajax的了解,来这里叙述下。心情好,嘿嘿嘿

ajax是一种创建交互式网页应用的网页开发技术。就是在不重新加载页面的情况下,更新部分网页。

ajax原理:ajax就是相当于在用户和服务器之间加了一个中间层,是用户操作与服务器操作相应异步化。并不是所有的用户请求都提交给服务器,像一些数据验证和数据处理等都交给了ajax引擎自己来做,只有确定需要从数据库读取数据的时候,再由ajax引擎代为向服务器提交请求。

ajax核心:通过XMLHttpRequest获取非本页内容。

ajax优势:

    1、通过异步处理的模式提升用户体验  

    2、优化浏览器与服务器之间的传输,减少不必要数据的往返,减少带宽(单位时间内通过的数据量)占用

    3、ajax引擎在客户端运行,承担一部分本来有服务器承担的任务,从而减少负载

ajax缺点:

    1、不能实时请求和响应服务器数据

    2、不支持浏览器回退功能

    3、不能提交媒体数据,图片和文件

原生写的ajax五部曲,必不能忘记:

    function ajax(){
      // 1.创建异步对象
      var ajaxObj = new XMLHttpRequest();

      // 2.设置url 方法
      ajaxObj.open(‘get‘,‘xxx.php‘);

      // 3.发送请求
      ajaxObj.send();

      // 4.为状态改变事件 绑定 对应的代码
      ajaxObj.onreadystatechange = function () {
        if (ajaxObj.readyState == 4 && ajaxObj.status==200) {
            // 5.在数据回来之后,修改界面的内容
            // 创建元素,添加到界面上,或者 其他的操作
            console.log(ajaxObj.responseText);
          }

      }
    }

关于readyState共有五个状态(友好网址:http://www.educity.cn/wenda/64512.html):

  0 - (未初始化)已经创建对象,还没有调用send方法

  1 - (加载)准备开始发送数据

  2 - (加载完成)已发送数据,正在等待响应返回

  3 - (交互)正在接受响应,但是接受不完整

  4 - (完成)接受响应完毕

(2、3、4都与响应挂钩,开始、过度、完成)

关于status :200,请求成功(友好网址:http://hibeary.iteye.com/blog/697997):

  其他:

  1xx - 信息提示

  2xx - 成功

  3xx - 重定向

  4xx - 客户端错误

  5xx - 服务器错误

时间: 2024-10-05 05:00:17

(二)关于ajax那些事的相关文章

java痛苦学习之路[十二]JSON+ajax+Servlet JSON数据转换和传递

1.首先客户端需要引入 jquery-1.11.1.js 2.其次javaweb工程里面需要引入jar包  [commons-beanutils-1.8.0.jar.commons-collections-3.1.jar.commons-lang-2.4.jar.commons-logging-1.1.3.jar.ezmorph-1.0.6.jar.json-lib-2.3-jdk15.jar] 3.客户端js端代码 4.servlet 服务器,映射的路径CardColl 以上就是整个过程,如果

COMET探索系列二【Ajax轮询复用模型】

COMET探索系列二[Ajax轮询复用模型] 写在前面:Ajax轮询相信大家都信手拈来在用,可是有这么一个问题,如果一个网站中同时有好多个地方需要用到这种轮询呢?就拿我们网站来说,有一个未读消息数提醒.还有一个时实时加载最新说说.昨天又加了一个全网喊话,以后还会要有类似功能添加是肯定的,难道要为每个功能都创建一个独立的轮询?要知道轮询请求中有大半是无用,会对服务器资源和宽带造成巨大的浪费.因此在页面中每增加一个轮询点,对服务器的压力及宽带浪费都将成倍的增长.再考虑一个情况,如果当前网页中需要的不

JQuery的AJAX调用(二)——AJAX方法

一,使用AJAX方法加载服务器数据 使用ajax()方法是最底层.功能最强大的请求服务器数据的方法,它不仅可以获取服务器返回的数据,还能向服务器发送请求并传递数值,它的调用格式如下: jQuery.ajax([settings])或$.ajax([settings]) 其中参数settings为发送ajax请求时的配置对象,在该对象中,url表示服务器请求的路径,data为请求时传递的数据,dataType为服务器返回的数据类型,success为请求成功的执行的回调函数,type为发送数据请求的

#IT明星不是梦# 自动化平台的构建与zabbix二次开发那些事

在前东家,我对于运维平台重新做了二次的改造,当然基于zabbix平台的功能也在不断的完善,相对于之前的基础架构,我们这次采用vue + element的前端架构,出图使用的是echart的方式.后端我们使用了restful的标准通信框架. 自动化架构 1.当然在讲到zabbix之前我们先看一下我们之前在老东家的时候做的相关的一些平台操作: 平台相关注解: 底层的数据主要使用CMDB来进行管理,CMDB开放APi接口给上层的发布系统.DB系统:当然各个子系统对接都是有权限审计. 数据录入统一使用脚

Laravel5.1 搭建简单的社区(十二)--Ajax更换头像

此篇记录如何使用ajax进行头像的更换,使用ajax需要引入一个jQuery的插件 jQuery form,在app.blade.php中引入: <link rel="stylesheet" href="/css/bootstrap.css"> {{--引入fontawesome--}} <link rel="stylesheet" href="/css/font-awesome.css"> <l

C#-WebForm-AJAX阿贾克斯(二)★★★★★ajax的完整结构★★★★★

ajax完整结构: $.ajax({ url:"",//服务器路径 data:{},//给服务端传递的参数,可以没有,也可以是多个 type:"post", //传递参数的方式,可post可get dataType:"json",//数据传递的格式,有json和xml两种 success:function(data){},//成功返回执行这里,顺序为2 beforeSend:function(){},//数据发送前执行此方法,一触发ajax就触发

AJAX(二)AJAX框架

上文(AJAX(一)AJAX的简介和基础)对ajax异步请求服务器做了详细的介绍和基础应用,可以看出,ajax的一些过程是相对不变的.不必要每次发送请求都写一遍发送代码,一些ajax开发人员已经把他们的过程封装成ajax框架. 本节主要介绍ajaxLib和ajaxGold两款框架. 1.ajaxLib ajaxLib是一个非常小巧的ajax框架. 使用它首先将文件使用引入到页面中.改框架是一个直接获取XML的框架,调运函数如下: loadXMLDoc(url,callback,boolean)

iOS关二维码那些事

在 iOS7 以前,在iOS中实现二维码和条形码扫描,我们所知的有,两大开源组件ZBar与ZXing. 这两大组件我们都有用过,这里总结下各自的缺点: ZBar ZBar在扫描的灵敏度上,和内存的使用上相对于ZXing上都是较优的,但是对于 “圆角二维码” 的扫描确很困难.如: ZXing ZXing 是 Google Code上的一个开源的条形码扫描库,是用java设计的,连Google Glass 都在使用的.但有人为了追求更高效率以及可移植性,出现了c++ port. Github上的Ob

echarts在.Net中使用实例(二) 使用ajax动态加载数据

前一篇文章链接:echarts在.Net中使用实例(一) 简单的Demo 通过上一篇文章可以知道和echarts参考手册可知,series字段就是用来存储我们显示的数据,所以我们只需要用ajax来获取series的值就可以. option 名称 描述 {color}backgroundColor 全图默认背景,(详见backgroundColor),支持rgba,默认为无,透明 {Array} color 数值系列的颜色列表,(详见color),可配数组,eg:['#87cefa', 'rgba