zoukankan      html  css  js  c++  java
  • 笔记-Ajax[1]-的整体流程。

    Ajax:异步的javascript and xml;(本文内容有部分是来自于js教程网)

    Ajax的功能:AJAX 可以与服务器交换数据,在不重新加载(刷新)整个页面的情况下,更新部分页面。

    Ajax的使用场景如:

      -用户注册时,输入完用户名立即提交到后台验证,检测用户名是否存。
      -静态页面实现登录功能。
      -瀑布流的实现。

    AJAX XMLHttpRequest对象:

      XMLHttpRequest 对象用于在后台与服务器交换数据,能够在不重新加载整个网页(刷新)的情况下,对网页进行部分更新。

      XMLHttpRequest 对象是 AJAX 的基础,讲 AJAX ,大部分是在讲 XMLHttpRequest 对象。

      所有现代浏览器(IE 7.0+、Chrome、FireFox、Opera、Safari)均支持 XMLHttpRequest 对象(IE5 和 IE6 使用 ActiveXObject)。

      对于较新的浏览器,创建 XMLHttpRequest 对象的语法:
      var xmlhttp=new XMLHttpRequest();

      对于比较老的IE浏览器(IE5 和 IE6),使用 ActiveX 来创建:
      var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

      兼容所有浏览器的创建 XMLHttpRequest 对象的代码:
      复制纯文本新窗口

      <script type="text/javascript">
      var xmlhttp;
      if(window.XMLHttpRequest){
      // code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }else{
      // code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    </script>

    AJAX的流程:

      1:创建ajax对象

      2:与服务器建立连接 open()方法

      3:发送请求(http协议) send()方法

      4:返回数据

    一个发送 AJAX 请求的完整代码:

    <script type="text/javascript">
      var xhr;
      // 创建 XMLHttpRequest 对象
      try{
      // code for IE7+, Firefox, Chrome, Opera, Safari
      xhr=new XMLHttpRequest();
      }catch(e){
      // code for IE6, IE5
      xhr=new ActiveXObject("Microsoft.XMLHTTP");
      }
      // 初始化请求参数
      xmlhttp.open("GET","/demo/javascript/ajax/ajaxDemo.php?action=getIP",true);
      // 发送请求
      xmlhttp.send();
    </script>

    open() 方法用来初始化 HTTP 请求参数,但是并不发送请求。

      语法: open(method,url,async)
      参数说明:
      method 必须参数。请求的类型,GET 或 POST。
      url 必须参数。文件在服务器上的位置。
      async 必须参数。是否异步发送请求,true(异步)或 false(同步)。
      注意:AJAX 的强大之处在于异步请求,所以 async 一般设置为 true ,否则将失去意义

    open()方法的提交数据方法get和post的区别:get方式提交的数据在url上显示,并且大小是有限制的,安全性不好。post方式是在http请求中传递,理论上数据有大小是限制的

    ,安全性较好。传递的多个值用&号来连接。

    异步和同步的区别:同步是指代码要一步一步来执行,前面 的代码执行完了,后面的代码才可以执行,而异步是前面的代码不影响后面的代码的执行,后面的代码可以先执行。

    其实ajax的交换过程和form表单的提交异曲同共之妙。

  • 相关阅读:
    我的第一个JAVA程序
    根据分辨率改变宽度 demo
    CSS判断不同分辨率显示不同宽度布局CSS3技术支持IE6到IE8
    学习lofter 让图片适应各个分辨率的方法
    浮点数剖析
    day03<Java语言基础+>
    ASCII码表完整版
    day02<Java语言基础+>
    day01<计算机基础知识&Java语言基础>
    Java集合----概述、Collection接口、Iterator接口
  • 原文地址:https://www.cnblogs.com/hellome/p/3770009.html
Copyright © 2011-2022 走看看