美文网首页
Ajax 之数据传输

Ajax 之数据传输

作者: 云音流 | 来源:发表于2016-12-30 20:43 被阅读0次

一、接收服务器端的响应数据类型

  1. 使用XMLHttpRequest核心对象的<code>responseText</code>属性

    该属性只能接受文本(HTML)格式

    问题:解析过程比较复杂,而且在拼串或拆串过程容易出错

  2. XML格式的数据

  3. json格式的数据

二、XML

  1. HTML/XHTML/DHTML/XML

    HTML: 网页文档
    XHTML:更严格的网页文档
    DHTML:DOM|DOM
    XML: 可扩展的标记语言,可用于配置文件|数据格式

  2. XML的文件为 .xml

  3. XML的定义方式与HTML非常相似

    HTML的元素都是预定义好的
    XML允许自定义元素

  4. XML版本

    1.0版本 、1.1版本,几乎没人使用

  5. XML作用

    作为数据格式-存储数据的地方

  6. XML语法

    • 声明

      <?xml version="1.0" encoding="utf-8" ?>
      
      version-设置XML文件的版本
      encoding-设置XML文件的编码
      
      声明必须出现在0行0列上
      
    • 定义元素

      根元素,必须是双标签,只能定义一个

      定义元素,元素名可以自定义,既可以双标签也可以是单标签

三、DOM解析XML字符串

  1. 创建DOM解析XML的解析器,解析器解析XML字符串

    • IE浏览器

        var parser = new ActiveXObject("Microsoft.XMLDOM");
            
        parser.async = false;
            
        xmlDoc = parser.loadXML(xmlFile);
      
    • 其他游览器

        var parser = new DOMParser();
      
        var xmlDoc = parser.parseFromString(xmlFile,"application/xml");
      
  2. 解析XML元素与解析HTML元素一致

    获取元素最常用的是<code>getElementsByTagName</code>很少使用<code>getElementByById</code>和<code>getElementsByName</code>

PS:

    浏览器不允许读取外部的XML文件
    浏览器解析符合XML格式的字符串

四、Ajax的XML格式传输



1.请求的数据格式-XML

  • 客户端如何构建XML格式的数据

    构建的数据类型 - 字符串类型
    字符串的内容要符合XML格式的语法要求

  • 服务器端如何接受符合XML格式的数据

    接收到的客户端的请求数据 - 字符串类型,php集成了DOM的相关内容
    
      DOMDocument
      DOMElement
      DOMNode
    

2.响应的数据格式-XML

  • 服务器端构建符合XML格式的数据

    设置服务器端的响应头Content-Type值为text/xml

     header("Content-Type:text/xml");
    

    构建符合XML格式的数据内容

      手动方式构建字符串内容
    
      DOMDocument对象的方法
      loadXML(符合XML格式的字符串)
      saveXML()方式进行响应
    
  • 客户端如何接受XML格式的数据

      使用XMLHttpRequest对象的<code>responseXML</code>属性接收
    
      接收到的就是XML DOM对象(不需要进行解析)
    

五、json

  1. JSON - javascript object notation(JS原生支持)

  2. json数据格式源于js

  3. 特点:

          易于程序员阅读和编写
          易于计算机解析和生成
        json是目前网络上使用最广泛的数据格式之一
    
  4. JSON的结构

            Array和Object
    
         支持的数据类型
    
       字符串、数值、布尔值、对象、数组、null
    

六、ajax中的json格式传输

  1. 请求格式为json

    • 客户端向服务器端发送请求为json格式的数据

             构建符合JSON格式的字符串
            定义字符串时,保证里面使用双引号,外面使用单引号
      
    • 服务器端接受json格式的数据

            使用json_decode()函数进行解析
         json_decode($json,true);ture代表是否转换为数组
      
  2. 响应格式为json

    • 服务器端向客户发送响应为json格式的数据

             手工方式构建json格式的字符串
      
             使用json_encode()函数将php变量(数组),转换成复合json格式的字符串
      
    • 客户端接受json格式的数据

              使用XMLHttpRequest对象的responseText属性接受
      
              然后使用eval函数进行转换,如果使用()包裹,eval函数强制转换为js代码,
      
         var json = eval("("+data+")");
      

HTML(文本)、XML格式、JSON格式的优缺点

  • HTML: 简单,但解析复杂
  • XML: 构建、解析复杂
  • JSON: 轻量级

相关文章

  • Ajax 之数据传输

    一、接收服务器端的响应数据类型 使用XMLHttpRequest核心对象的 responseText 属性该属性只...

  • jquery的ajax请求

    $.ajax({ type: "POST",//数据传输方式 url: "xxxx...

  • Ajax小案例之获取后台信息显示

    知识点:数据传输--------jsonjquery-----------.ajax()获取**html部分 注...

  • 前端开发收集 - 收藏集 - 掘金

    Ajax 与数据传输 - 前端 - 掘金背景 在没有ajax之前,前端与后台传数据都是靠表单传输,使用表单的方法传...

  • Ajax入门(js版)

    Ajax的优缺点: 优点:1、最少量的数据传输。传统的静态页面要刷新整个页面,而Ajax仅需要少量数据即可动态的...

  • Ajax

    ajax 是什么?有什么作用? AJAX 在浏览器与 Web 服务器之间使用异步数据传输(HTTP 请求)从服务器...

  • AJAX-全集

    同步+异步 Ajax同步+异步 JavaScript之(AJAX) JQuery之(AJAX) JQuery-有f...

  • Spring中ajax与后台传输数据的几种方式

    最近写ajax与后台传输数据的时候碰到了一个问题,我想ajax以json的方式把数据传输个后台,后台用map的形式...

  • ajax与前进后退

    Ajax可以实现页面的无刷新操作但是,也会造成另外的问题,无法前进与后退,如果想既可以使用ajax做数据传输右想实...

  • Ajax与数据传输

    背景 在没有ajax之前,前端与后台传数据都是靠表单传输,使用表单的方法传输数据有一个比较大的问题就是每次提交数据...

网友评论

      本文标题:Ajax 之数据传输

      本文链接:https://www.haomeiwen.com/subject/snzmvttx.html