AJAX和JSON

最新推荐文章于 2021-10-01 16:30:20 发布
最新推荐文章于 2021-10-01 16:30:20 发布
阅读量204 收藏
点赞数
分类专栏： JQuery 文章标签： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Dnesity/article/details/104850264
版权

一、AJAX：

    1. 概念： ASynchronous JavaScript And XML    异步的JavaScript 和 XML

        1. 异步和同步：客户端和服务器端相互通信的基础上

            * 客户端必须等待服务器端的响应。在等待的期间客户端不能做其他操作。

            * 客户端不需要等待服务器端的响应。在服务器处理请求的过程中，客户端可以进行其他的操作。

            Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。 通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

            传统的网页（不使用 Ajax）如果需要更新内容，必须重载整个网页页面。

            目的：提升用户的体验

 

 2. 实现方式：

        1. 原生的JS实现方式（了解）

XMLHttpRequest 是 AJAX 的基础。

XMLHttpRequest 对象：所有现代浏览器均支持 XMLHttpRequest 对象（IE5 和 IE6 使用 ActiveXObject）。XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。由于浏览器不同，在创建对象前需要浏览器的类型创建不同的对象。 所有现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建 XMLHttpRequest 对象：老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象。

方法

描述

 

 

onreadystatechange 事件

 

open(method,url,async)

 

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

  • method：请求的类型；GET 或 POST

  • url：文件在服务器上的位置

  • async：true（异步）或 false（同步）

send(string)

 

将请求发送到服务器。

  • string：仅用于 POST 请求

POST和GET：

与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。

然而，在以下情况中，请使用 POST 请求：

  • * 无法使用缓存文件（更新服务器上的文件或数据库）

  • * 向服务器发送大量数据（POST 没有数据量限制）

  • * 发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

 

服务器响应：如需获得来自服务器的响应，请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。

属性

描述

responseText

获得字符串形式的响应数据。（ 如果来自服务器的响应并非 XML，请使用 responseText 属性。）

responseXML

获得 XML 形式的响应数据。（ 如果来自服务器的响应是 XML，而且需要作为 XML 对象进行解析，请使用 responseXML 属性： ）

 

onreadystatechange 事件

当请求被发送到服务器时，我们需要执行一些基于响应的任务。每当 readyState 改变时，就会触发 onreadystatechange 事件。readyState 属性存有 XMLHttpRequest 的状态信息。

属性

描述

onreadystatechange

 

存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。

 

 

 

 

readyState

 

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

  • * 0: 请求未初始化

  • * 1: 服务器连接已建立

  • * 2: 请求已接收

  • * 3: 请求处理中

  • * 4: 请求已完成，且响应已就绪

status

200: "OK"

404: 未找到页面

当 readyState 等于 4 且状态为 200 时，表示响应已就绪：

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }

示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>


        //定义方法
            //1.创建核心对象
            var xmlhttp;
            //XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
            if (window.XMLHttpRequest) {// 所有现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建 XMLHttpRequest 对象。
                xmlhttp = new XMLHttpRequest();
            } else {// 老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
        function asyn() {


            //2. 建立连接
            xmlhttp.open("GET", "ajaxServlet?username=tom", true);


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


            //4.接受并处理来自服务器的响应结果
            //获取方式 ：xmlhttp.responseText
            //什么时候获取？当服务器响应成功后再获取


            //当xmlhttp对象的就绪状态改变时，触发事件onreadystatechange。
            xmlhttp.onreadystatechange = function () {
                //判断readyState就绪状态是否为4，判断status响应状态码是否为200
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    //获取服务器的响应结果
                    var responseText = xmlhttp.responseText;
                    alert(responseText);
                }
            }
        }
            function syn() {
                xmlhttp.open("GET","ajaxServlet?username=Roje",false);
                xmlhttp.send();
                xmlhttp.onreadystatechange=function()
                {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                        var responseText=xmlhttp.responseText;
                        alert(responseText);
                    }
                }
            }
    </script>
    
</head>
<body>


    <input type="button" value="发送异步请求" onclick="asyn()">
    <input type="button" value="发送同步请求" onclick="syn()">
    <input>
</body>
</html>

AjaxServlet.java

package show.cactus.web;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet("/ajaxServlet")
public class AjaxServlet extends HttpServlet {
   protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
      response.setContentType("text/text;charset=utf-8");
      response.setCharacterEncoding("UTF-8");
      //1.获取请求参数
      String username = request.getParameter("username");
      //模拟处理业务逻辑，耗时
      try {
         Thread.sleep(5000);
      } catch (InterruptedException e) {
         e.printStackTrace();
      }


      //2.打印username
      System.out.println(username);


      //3.响应
      response.getWriter().write("hello:"+username);
   }


   protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
      this.doPost(request, response);
   }
}

运行结果：

发送异步请求时：可以在输入框中输入

发送同步请求时：无法获取输入文本框焦点

        2. JQeury实现方式

            1. $.ajax()：执行异步 HTTP (Ajax) 请求。

                * 语法：$.ajax({键值对});

 

            2. $.get()：发送get请求

                * 语法：$.get(url, [data], [callback], [type])

            3. $.post()：发送post请求

                * 语法：$.post(url, [data], [callback], [type])

                    * 参数：

                        * url：请求路径

                        * data：请求参数

                        * callback：回调函数

                        * type：响应结果的类型

 

            4.jQuery load() 方法 从服务器加载数据，并把返回的数据放入被选元素中。

                *语法：$(selector).load(URL,data,callback);

 

JQuery发送异步请求方式一AJAX：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.3.1.min.js"></script>


    <script>//定义方法
        function fun() {
            //使用$.ajax发送异步请求
            $.ajax({
                url:"../ajaxServlet",//请求路径
                type:"POST",//请求方式
                // data:"username=jack&age=123",//请求参数
                data:{"username":"jack","age":23},
                success:function (data) {
                    alert(data);
                },//响应成功后的回调函数
                error:function () { //表示如果请求响应出现错误
                    alert("出错啦");
                },
                dataType:"text"//设置接受到的响应数据格式
            })
        }
    </script>
</head>
<body>
<input type="button" value="发送异步请求" onclick="fun()">
<input>
</body>
</html>

运行结果：

 

JQuery发送异步请求方式二GET：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.3.1.min.js"></script>


    <script>//定义方法
        function fun() {
            //使用$.ajax发送异步请求
            $.get("../ajaxServlet",{username:"Rose"},function (data) {
                alert(data);
            },"text");
        }
    </script>
</head>
<body>
<input type="button" value="发送异步请求" onclick="fun()">
<input>
</body>
</html>

运行结果：

 

JQuery发送异步请求方式三POST：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.3.1.min.js"></script>
    <script>//定义方法
        function fun() {
            //使用$.ajax发送异步请求
            $.post("../ajaxServlet",{username:"Rose"},function (data) {
                alert(data);
            },"text");
        }
    </script>
</head>
<body>
<input type="button" value="发送异步请求" onclick="fun()">
<input>
</body>
</html>

运行结果：

 

 

二、JSON：
    1. 概念： JavaScript Object Notation        JavaScript对象表示法
 
        * json现在多用于存储和交换文本信息的语法，进行数据的传输 类似 XML。
        * JSON 比 XML 更小、更快，更易解析。
        *JSON 独立于语言 *
    
    2. 语法：
        1. 基本规则
            * 数据在名称/值对中：json数据是由键值对构成的， 键用引号(单双都行)引起来，也可以不使用引号    名称/值    "firstName" : "John"     'firstName' : "John"     firstName: "John"  
            * 数据由逗号分隔：多个键值对由逗号分隔
            * 花括号保存对象：使用{}定义json 格式
            * 方括号保存数组：[]
                * 值得取值类型：
                    1. 数字（整数或浮点数）
                    2. 字符串（在双引号中）
                    3. 逻辑值（true 或 false）
                    4. 数组（在方括号中）    {"persons":[{},{}]}
                    5. 对象（在花括号中） {"address":{"province"："陕西"....}}
                    6. null

示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<p>
    Name: <span id="jname"></span><br />
    Age: <span id="jage"></span><br />
    Address: <span id="jstreet"></span><br />
    Phone: <span id="jphone"></span><br />
</p>
<script>
        var JSONObject= {
            "name":"Bill Gates",
            "street":"Fifth Avenue New York 666",
            "age":56,
            "phone":"555 1234567"};
        document.getElementById("jname").innerHTML=JSONObject.name;
        document.getElementById("jage").innerHTML=JSONObject.age;
        document.getElementById("jstreet").innerHTML=JSONObject.street;
        document.getElementById("jphone").innerHTML=JSONObject.phone;
</script>
</body>
</html>

运行结果：

 

        2. 获取数据:

            1. json对象.键名

            2. json对象["键名"]

            3. 数组对象[索引]

            4. 遍历

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


<script>
    //1.定义基本格式
    var person = {"name": "张三", age: 23, 'gender': true};
    var ps = [{"name": "张三", "age": 23, "gender": true},
        {"name": "李四", "age": 24, "gender": true},
        {"name": "王五", "age": 25, "gender": false}];


    //获取person对象中所有的键和值
    //for in 循环
    /* for(var key in person){
         //这样的方式获取不行。因为相当于  person."name"
         //alert(key + ":" + person.key);
         alert(key+":"+person[key]);
     }*/


    //获取ps中的所有值
    for (var i = 0; i < ps.length; i++) {
        var p = ps[i];
        for(var key in p){
            alert(key+":"+p[key]);
        }
    }
</script>
</body>
</html>

 

    3. JSON数据和Java对象的相互转换

注意： 因为 JSON 使用 JavaScript 语法，所以无需额外的软件就能处理 JavaScript 中的 JSON。

        * JSON解析器：

            * 常见的解析器：Jsonlib，Gson，fastjson，jackson

        

        1. JSON转为Java对象

            1. 导入jackson的相关jar包

            2. 创建Jackson核心对象 ObjectMapper

            3. 调用ObjectMapper的相关方法进行转换

                1. readValue(json字符串数据,Class)

示例：

    //Json字符串转换为java对象
   @Test
   public void  test5() throws Exception {
      //1.初始换json
      String json = "{\"name\":\"张三\",\"age\":23,\"gender\":\"男\"}";


      //2.创建ObjectMapper对象
      ObjectMapper mapper = new ObjectMapper();


      //3.转换为Java对象Person
      Person person = mapper.readValue(json, Person.class);
      System.out.println(person);
   }
}

运行结果：

 

        2. Java对象转换JSON

            1. 使用步骤：

                1. 导入jackson的相关jar包

                2. 创建Jackson核心对象 ObjectMapper

                3. 调用ObjectMapper的相关方法进行转换

                    1. 转换方法：

                        * writeValue(参数1，obj):

                            参数1：

                                File：将obj对象转换为JSON字符串，并保存到指定的文件中

                                Writer：将obj对象转换为JSON字符串，并将json数据填充到字符输出流中

                                OutputStream：将obj对象转换为JSON字符串，并将json数据填充到字节输出流中

                        * writeValueAsString(obj):将对象转为json字符串

package show.cactus.domian.show.cactus.test;


import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.junit.Test;
import show.cactus.domian.Person;

import java.io.File;
import java.io.FileWriter;


public class JacksonTest {


   //Java对象转为Json
   @Test
   public void  test1() throws Exception {
      //1.Person创建对象
      Person p = new Person();
      p.setName("张三");
      p.setAge(23);
      p.setGender("男");


      //2.创建JackSon核心对象
      ObjectMapper mapper = new ObjectMapper();


      //3.转换
      String json = mapper.writeValueAsString(p);
      
      //{"name":"张三","age":23,"gender":"男"}
      System.out.println(json);


      //将数据写到a.txt
      mapper.writeValue(new File("d://a.txt"),p);


      //关联到Writer中
      mapper.writeValue(new FileWriter("d://b.txt"),p);


   }
}

运行结果：

 

                    2. 注解：

                        1. @JsonIgnore：排除属性。放在属性上方

                            @JsonIgnoreProperties(value = {"birthday"})：排除指定属性，放在类的上方

                        2. @JsonFormat：属性值得格式化

                            * @JsonFormat(pattern = "yyyy-MM-dd")

//@JsonIgnoreProperties(value = {"birthday"})
public class Person {
   private String name;
   private int age;
   private String gender;


   //@JsonIgnore
   @JsonFormat(pattern = "yyyy-MM-dd")    //格式化日期
   private Date birthday; //忽略生日

运行结果：

 

                   3. 复杂java对象转换

                        1. List：数组

                        2. Map：对象格式一致

    mapper.writeValue(response.getWriter(),map);

 

# 案例：

    * 校验用户名是否存在

        1. 服务器响应的数据，在客户端使用时，要想当做json数据格式使用。有两种解决方案：

            1. $.get(type):将最后一个参数type指定为"json"

            2. 在服务器端设置MIME类型，通常使用这种方式

                response.setContentType("application/json;charset=utf-8");

 

regist.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
</head>
<script src="js/jquery-3.3.1.min.js"></script>


<script>
    $(function () {
        //绑定离焦事件
        $("#username").blur(function () {
            //获取文本
            var  username = $(this).val();
            //发送ajax请求，校验用户名是否存在
            //期望服务器响应数据格式："userExsit":true,"msg":"此用户名太受欢迎"
            //                        "userExsit":false,"msg":"用户名可用"
            $.get("findUserServlet",{username:username},function (data) {
            var span = $("#s_username");
                if(data.userExsit){
                    //用户名存在
                    span.css("color","pink");
                    span.html(data.msg);
                }else{
                    //用户名不存在
                    span.css("color","green")
                    span.html(data.msg);
                }
            })
        });
    })


</script>
<body>
    <form>
        <input type="text" id="username" name="username" placeholder="请输入用户名">
        <span id="s_username"></span>
        

        <input type="password" name="password" placeholder="请输入密码">

        <input type="submit" value="注册">

    </form>
</body>
</html>

 

FindUseServlet.java

import com.fasterxml.jackson.databind.ObjectMapper;


import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;


@WebServlet("/findUserServlet")
public class FindUserServlet extends HttpServlet {
   protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
      //1.获取用户名
      String username = request.getParameter("username");


      //2.调用dao层，检验用户名是否存在
      //期望服务器响应数据格式："userExsit":true,"msg":"此用户名太受欢迎"
      //                        "userExsit":false,"msg":"用户名可用"


      //设置响应的数据格式为json
      response.setContentType("application/json;charset=utf-8");


      Map<String,Object> map = new HashMap<String,Object>();
      if("tom".equals(username)){
         //存在
         map.put("userExsit",true);
         map.put("msg","此用户名太受欢迎");
      }else {
         //不存在
         map.put("userExsit",false);
         map.put("msg","用户名可用");
      }


      //将map转为Json，传递给客户端
      ObjectMapper mapper = new ObjectMapper();


      mapper.writeValue(response.getWriter(),map);


   }


   protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
      this.doPost(request, response);
   }
}

运行结果：

 

 

 

Cactus仙人掌
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
优雅的处理javascript异步请求—callback
renzhongrui的博客
11-09 942
场景描述 做web前端的经常遇到需要请求多个服务接口的情况，然后获取到最后的返回值，比如：当前有一个文件上传接口，这个接口每次只能上传一个文件。 这时候产品经理过来说：前端小猿同学，这有3张图片要上传到服务端。 前端小猿一看接口，文件上传接口每次只能上传一个文件，3个图片就需要调用3次接口，而且只能等3张图片上传成功之后才能进行下一步的操作。为了赶进度，所以初步实现方式就出来了： getData(...
ajax使用 ajax+json
桃子疯狂_博客
11-08 3万+
首先将ajax写于js方法中,定义事件,让元素触发,触发之后就会有数据产生给服务端 $.ajax({ type: "POST", url: "test.php", data: "name=garfield&amp;age=18", success: function(dat...
AJAX+JSON总结
菲宇运维
01-07 830
ajax原理 AJAX是基于现有的Internet标准，并且联合使用它们： XMLHttpRequest 对象 (异步的与服务器交换数据) JavaScript/DOM (信息显示/交互) CSS (给数据定义样式) XML (作为转换数据的格式) 1、使用步骤 创建 XMLHttpRequest 对象 variable=new XMLHttpRequest(); XMLH...
Ajax基础：发送jsonp请求（jsonp、jsonCallback）
昔冰_G的博客
10-01 1万+
jsonp走的是get请求方式，也就是ajax的默认请求方式； ajax方法中也涵盖了jsonp请求，可以通过ajax方法来发送jsonp请求； <!--客户端代码--> <body> <button id="btn">发送jsonp请求</button> <script src="js/jquery-3.5.1.min.js"></script> <script> $('#bt
ajax JSONP请求 处理回调函数的注意：jsonpCallback是区分大小写
热门推荐
____
09-08 4万+
使用ajax进行 JSONP跨域请求，因为被请求的对方的回调函数是无法修改。对方返回的JS都固定了回调函数名称_Callback。而这边页面中会出现多个JSONP请求，他们的回调函数名称都是_Callback,想到设置AJAX 的JSONP参数。但是发现根本不起作用。最后偶然发现 jsonpcallback是区分大小写的。必须是  jsonpCallback 而不是jsonpcallback
Ajax和Json的笔记
03-06
Ajax和Json的笔记
什么是Ajax和json？？？
07-25
### 什么是Ajax和JSON？ #### 1. Ajax详解 ##### 1.1 定义Ajax **Ajax**（Asynchronous JavaScript and XML）是一组技术的集合，这些技术结合在一起能够实现浏览器端对用户请求的异步处理，从而提高用户体验。...
Ajax-and-JSON-tuts:Ajax和JSON-初学者-11章-源代码-ajax source code
03-25
Ajax 和 JSON 是现代 web 开发中的重要技术，用于创建交互性更强、响应速度更快的网页。这个名为 "Ajax-and-JSON-tuts" 的资源包，很可能是为初学者准备的一系列教程，涵盖了从基础到进阶的 Ajax 和 JSON 使用方法。...
jQuery-ajax-json实现自动轮播图.rar
04-25
本教程将介绍如何利用jQuery、ajax和json技术来实现一个自动轮播图的功能。jQuery是一个轻量级的JavaScript库，极大地简化了DOM操作、事件处理和Ajax交互；ajax用于异步数据传输，使页面无需刷新即可获取新数据；...
Ajax+Json案例
02-13
这个“Ajax+Json案例”可能是一个教学资源或者示例代码集合，用于帮助开发者理解和实践这两种技术的结合。 Ajax是一种在不刷新整个网页的情况下，通过后台与服务器进行少量数据交换，从而实现局部更新页面的技术。...
json跨域和ajax callback函数
gaofly89的专栏
03-19 4401
最近做的一些东西都涉及到跨域访问的问题。我觉得使用ajax访问url的时候，通常返回的数据都会出现在success里，然后再success里写上自己的逻辑。结果今天遇到了一个问题。在chrome中debug的时候，发现数据已经返回到客户端了。只是接收的方法有问题。后来请教高手后，才知道，callback函数没有定义。汗颜！！ 代码如下： $.ajax({ //crossDomain: tr
ajax-jsonp跨域解决办法
Primise7的博客
05-11 581
说起Ajax，不可避免面临两个问题： 第一个是Ajax以何种格式来交换数据？ 第二个是跨域的需求如何解决？ 首选方案：JSON来传数据，靠JSONP来跨域 jsonp : JSON with Padding 用json去填充,填充什么？填充函数。返回的是一个函数调用! jsonp原理剖析 本质是利用了标签具有可跨域的特性...
封装Ajax请求，callback函数参数分析
ShangQuan2012的博客
08-12 6550
/** * 封装Ajax函数 * 功能：发送一个Ajax请求，并且可以执行回调函数 * @param url *            发送请求的地址 * @param params *            参数列表,json格式,如{id:3,name:'张三'} * @param callback *            请求成功时的回掉函数 * @param type 
关于跨域$.ajax调用jsonp接口的用法——两个属性jsonp的作用-调整等号左侧的参数名称-用于配合后台获取回调函数名称 & jsonpCallback的作用-调整回调函数的名称
weixin_44867717的博客
12-21 839
关于跨域$.ajax调用jsonp接口的用法——两个属性:jsonp的作用-调整等号左侧的参数名称-用于配合后台获取回调函数名称 & jsonpCallback的作用-调整回调函数的名称 操作流程-制作跨域 demo文件目录如下： 在BootCDN官网：https://www.bootcdn.cn/点击jquery，进入https://www.bootcdn.cn/jquery/ 复制 <script src="https://cdn.bootcdn.net/ajax/libs/jquery
Ajax + jsonp 前后台实现
yh_852974543的博客
05-17 3850
域名不同 或者 域名相同端口不同 都算是跨域请求，js出于对安全考虑不支持跨域请求。我们可以使用JSONP解决跨域问题。 1.jsonp只能使用get请求，解决同源问题，返回javascript代码，因为请求javascript文件是没有同源问题的。 2.当请求数据类型为jsonp时，会将callback=jsonpCallback（自定义函数名称）加在url上，http://127.0.0....
Jquery跨域获得Json
weixin_33727510的博客
06-24 364
这两天用 Jquery 跨域取数据的时候，经常碰到 invalid label 这个错误，十分的郁闷，老是取不到服务器端发送回来的 json 值， 一般跨域用到的两个方法为：$.ajax 和$.getJSON   最后，仔细安静下来，细读 json 官方文档后发现这么一段：   JSON数据是一种能很方便通过JavaScript解析的结构化数据。如果获取的数据文件存放在远程服务器上（域名...
详细介绍Ajax和Json
最新发布
04-02
Ajax（Asynchronous ...Ajax和Json通常一起使用，Ajax用于异步获取数据，Json用于将数据从服务器传输到客户端。在Web应用程序中，通过使用Ajax和Json，可以实现动态的交互式用户界面，提高用户体验和应用程序的功能。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值