• 了解AJAX


    1. 如何解决AJAX的跨域问题?

    1、在请求页面上使用Access-Control-Allow-Origin标头。

       使用如下标头可以接受全部网站请求:

    header('Access-Control-Allow-Origin:*')

      使用如下标头可以接受指定网站请求:

    header('Access-Control-Allow-Origin:http://www.abc.com')

    2、使用jsonp跨域请求。

    $data = json_encode(array('msg'=>'msg....'));

    die( $_REQUEST['function_name_index'].'('.$data.')' );

    <!DOCTYPE html>

    <html lang="en" class="">

    <head>

    <meta charset="utf-8" />

    <title>测试</title>

    <script src="http://www.ysont.cn/plugs/cookie/js/jquery-1.11.1.min.js"></script>

    <body>

    <script>

        $.ajax({

            url:'http://192.168.1.124/homekoo.com/zde/cors_1.php',

            dataType:'jsonp',

            jsonp:'function_name_index',

            jsonpCallback:'function_name',

            success:function(data){

                alert(data.msg);

            }

        });

    </script>

    </body>

    </html>

     

    1. 什么是AJAX?AJAX的技术体系组成是由那几部分组成? 

    不是新技术,而是之前技术的整合
       Ajax: Asynchronous Javascript And Xml;
           (异步的JavaScriptXML
       包括的技术:JavaScriptXMLCSSXMLHttpRequest
       异步:发送请求以后,不等结果,由回调函数处理。
       JavaScript:向服务器发送请求,获得返回结果,更新页面
       XML: 用来封装数据

    1)创建XMLHttpReuest对象
         IE浏览器(Mozilla/Safari):
         var xhr=new XMLHttpRequest();
         IE:
         xhr=new ActiveXObject("Msxml2.XMLHTTP");
         低版本IE:
         xhr=new ActiveXObject("Microsfot.XMLHTTP"); 
       2)XMLHttpRequest对象的属性与方法
         a)方法
          open("GET/POST",URL,true/false):用来向服务器建立连接
           有三个参数:
           参数1:提交方式,postget
           参数2:请求的URL
           参数3:表示同步或异步请求,true:表示异步请求
           false: 表示同步请求

          send(data):发送请求
           参数:提交的内容。

           POST方式:data就是提交的参数,send(username=root&password=abc123);

           GET方式:send(null)

        b)属性
         onreadystatechange:设置状态改变时的回调函数,回调函数用来获取服务器数据。

           onreadystatechange=function(){      

          


         readyState:服务器状态响应
           状态码:
           0:未初始化
           1:正在加载
           2:加载完成
           3:请求进行中
           4:请求完成


         responseText:服务器返回的数据(文本格式)

         responseXML:服务器返回的数据(XML格式)

     

    1. AJAX优点与缺点分别是什么?

    (1).AJAX的优点
    <1>.无刷新更新数据。
    AJAX最大优点就是能在不刷新整个页面的前提下与服务器通信维护数据。这使得Web应用程 序更为迅捷地响应用户交互,并避免了在网络上发送那些没有改变的信息,减少用户等待时间, 带来非常好的用户体验。
    <2>.异步与服务器通信。
    AJAX使用异步方式与服务器通信,不需要打断用户的操作,具有更加迅速的响应能力。优化了 BrowserServer之间的沟通,减少不必要的数据传输、时间及降低网络上数据流量。
    <3>.前端和后端负载平衡。
    AJAX可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服 务器和带宽的负担,节约空间和宽带租用成本。并且减轻服务器的负担,AJAX的原则是按需取 数据,可以最大程度的减少冗余请求和响应对服务器造成的负担,提升站点性能。
    <4>.基于标准被广泛支持。
    AJAX基于标准化的并被广泛支持的技术,不需要下载浏览器插件或者小程序,但需要客户允许 JavaScript在浏览器上执行。随着Ajax的成熟,一些简化Ajax使用方法的程序库也相继问世。 同样,也出现了另一种辅助程序设计的技术,为那些不支持JavaScript的用户提供替代功能。
    <5>.界面与应用分离。
    Ajax使WEB中的界面与应用分离(也可以说是数据与呈现分离),有利于分工合作、减少非技 术人员对页面的修改造成的WEB应用程序错误、提高效率、也更加适用于现在的发布系统。

    (2).AJAX的缺点
    <1>.AJAX干掉了BackHistory功能,即对浏览器机制的破坏。
    <2>.AJAX的安全问题。
    <3>.对搜索引擎支持较弱。
    <4>.破坏程序的异常处理机制。
    <5>.违背URL和资源定位的初衷。
    <6>.AJAX不能很好支持移动设备。
    <7>.客户端过肥,太多客户端代码造成开发上的成本。

     

    1. AJAX应用和传统Web应用有什么不同?

    a) 在传统的Javascript编程中,如果想得到服务器端数据库或文件上的信息,或者发送客户端信息到服务器,需要建立一个HTML form然后GET或者POST数据到服务器端。用户需要点击”Submit”按钮来发送或者接受数据信息,然后等待服务器响应请求,页面重新加载。 
    因为服务器每次都会返回一个新的页面, 所以传统的web应用有可能很慢而且用户交互不友好。 
    使用AJAX技术, 就可以使Javascript通过XMLHttpRequest对象直接与服务器进行交互。 
    通过HTTP Request, 一个web页面可以发送一个请求到web服务器并且接受web服务器返回的信息(不用重新加载页面),展示给用户的还是通一个页面,用户感觉页面刷新,也看不到到Javascript后台进行的发送请求和接受响应。

    1. Ajax和javascript的区别?

    a)  javascript是一种用于浏览器的脚本语言,它的主要功能分dom和bom操作两种,前者用于对网页文档进行操作,后者对于浏览器对象进行操作,它们都具有丰富多彩的强大效果。虽然JavaScript在诞生之初借用了Java的名,但从前景来看,这种动态弱类型的脚本语言可能比静态强类型的Java要更有前途。

    Ajax诞生于2005年,这是一种借助XMLHttpRequest异步与后台进行通信的“新”技术。XMLHttpRequest,加上dom,css,xml等各项技术,再使用JavaScript将它们糅合在一起,就组成了Ajax。它的最大特点是异步无刷新的响应机制,这使BS程序开始在界面感观上能与CS程序媲美。此外,Ajax还不限后台语言,这使得它从诞生之初就得到了非常广泛的认同和使用。

  • 相关阅读:
    通过欧拉计划学Rust编程(第500题)
    通过欧拉计划学Rust编程(第54题)
    刷完欧拉计划中难度系数为5%的所有63道题,我学会了Rust中的哪些知识点?
    用欧拉计划学Rust编程(第26题)
    通过欧拉计划学习Rust编程(第22~25题)
    用欧拉计划学Rust语言(第17~21题)
    用欧拉计划学习Rust编程(第13~16题)
    用欧拉计划学Rust语言(第7~12题)
    通过欧拉计划学Rust(第1~6题)
    《区块链生存训练2.0》PDF
  • 原文地址:https://www.cnblogs.com/ServletGo/p/9875429.html
Copyright © 2020-2023  润新知