• ajax


    一、

    ajax:前后台数据交互依赖的一项技术。

    ajax是异步的javaScript和XML,它最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。

    1.XMLHttpRequest    ActiveXObject

    XMLHttpRequest 是 AJAX 的基础。

    XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

    所有现代浏览器(IE7+、Firefox、Chrome、Safari 以及 Opera)均内建 XMLHttpRequest 对象

    老版本的 Internet Explorer (IE5 和 IE6)使用 ActiveX 对象

    variable=new XMLHttpRequest();

    variable=new ActiveXObject("Microsoft.XMLHTTP");

    2.ajax向服务器发送请求

    这里用到XMLHttpRequest对象的两个方法:

    open()     规定请求的类型、URL 以及是否异步处理请求。  

             open(method,url,async)

    send()    将请求发送到服务器。

             send(string)   这里的 string只用于post请求

    3.onreadystatechange事件

    当请求被发送到服务器时,我们需要执行一些基于响应的任务。

    每当 readyState 改变时,就会触发 onreadystatechange 事件。

    readyState 属性存有 XMLHttpRequest 的状态信息。

    下面是 XMLHttpRequest 对象的三个重要的属性:

    onreadystatechange     存储函数,每当readyState属性改变时,就会调用该函数。

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

          0: 请求未初始化

          1: 服务器连接已建立

          2: 请求已接收

          3: 请求处理中

          4: 请求已完成,且响应已就绪

    status           200:"OK"

            404:未找到页面

    4.responseText    服务器响应

    获得字符串形式的响应数据

    原生ajax

    function ajax(method,url,sync,fn){
     var xmlhttp=new XMLHttpRequest()
     xmlhttp.open(method,url,sync)
     xmlhttp.send()
     xmlhttp.onreadystatechange=function(){
      if(xmlhttp.readyState==4){
       if(xmlhttp.status==200){
        fn(xmlhttp.responseText)
       }
      }
     }
    }
    ajax(“get”,“data/aa.txt”,true,ff)
    function ff(data){
     var arr=JSON.parse(data)
     document.getElementById(“div”).innerHTML=arr[0].name;
    }

    二、JQuery ajax

    方法:

    $.ajax({

      async:true,

      data:{},

      url:"",

      dataType:jsonp,

      error:(xhr,tatus,error),

      jsonp:"call/callback",

      jsonpCallback:"fn",

      success:(result,status,xhr)

    })

    $.get("url",{给路径添加的内容},function(路径里的内容){})

    $.post("url",{给路径添加的内容},function(路径里的内容){})

    load:    $(selector).load(url,data,function(response,status,xhr))

    三、ajax中的跨域问题

    不在同一个服务器下就是协议域名端口三者有一个不一样就是跨域

       解决跨域

    靠标签身上的src属性解决跨域的问题,利用script标签的src属性去请求外部的数据

    看网络地址关键单词 cb和callback

           1.自己提供的接口

      写的顺序:先处理数据;(回调数据中的函数名)

      再通过script中的src属性,去链接到自己的接口;(自己写的数据只用一个函数名包着,便于回调)

      2.别人提供的接口:

      写的顺序:先处理数据  (回调数据中的函数名)

      再通过script中的src属性,去 链接到别人的接口;(并将cb后面别人的的函数名,改为自己要处理数据的函数名,便于回调)

      3.dom创建的方式;

      var script=document.createElement("script");

      script.src="网络地址"     (并将cb后面别人的的函数名,改为自己要处理数据的函数名,便于回调)

      document.body.appendChild(script)

      写函数处理数据   (cb后面的函数名)

      Ajax传入的数据的话,只能是字符串或数字,字段,其他形式的传参都不可以;

      Ajax只是跟后台交互也有同源策略的限制;

      不是当前服务器叫跨域;

      Ajax也有同源策略的限制想做跨域处理,只能通过script标签中的src属性才可以;

      access同源策略的报错;

  • 相关阅读:
    对于python中的self,cls,decorator的理解
    获得平台无关的文件锁
    Python 字符编码判断
    Flex 减肥
    Reporting Service报表开发
    JavaScript 中的单例模式 (singleton in Javascript)
    asp.net MVC 权限设计
    c# IO&&线程 打造 定时打开指定程序
    JavaScript 实现接口 (Interfaces In JavaScript)
    C#温故而知新—闲话.Net
  • 原文地址:https://www.cnblogs.com/liancai001/p/10527871.html
Copyright © 2020-2023  润新知