在前端开发中，使用AJAX从服务器获取数据是很常见的需求。jQuery提供了方便的方法来处理AJAX请求，其中$.getJSON()方法可以用来获取JSON格式的数据。
本文将介绍如何使用jQuery的$.getJSON()方法将JSON数据保存到变量中，并提供示例代码和指导意义。
使用$.getJSON()方法获取JSON数据
$.getJSON()方法是一个简单的封装，用于执行GET请求获取JSON格式的数据。该方法支持传递参数，例如URL、数据、回调函数等等，以便与服务器进行交互并获取所需的数据。
以下是一个基本的用法：
-------------- -------------- - -- ------------ ---
其中，url是要获取的JSON数据的URL地址。当请求成功时，data参数将包含从服务器返回的JSON数据。您可以使用这个数据来更新页面或执行其他操作。
将JSON数据保存到变量中
如果我们想在后续的代码中使用JSON数据，可以将其保存到变量中。为此，在$.getJSON()方法中使用回调函数，将数据作为参数传递给另一个函数来处理。
以下是一个示例，它演示了如何将从服务器获取的JSON数据保存到变量中：
--- --------- -------------- -------------- - -- --------- -------- - ----- --- -- -------------------
在这个示例中，我们定义了一个名为jsonData的变量来保存JSON数据。当$.getJSON()方法获取到数据时，它将调用回调函数并将数据作为参数传递给它。在回调函数中，我们将数据保存到jsonData变量中。
现在我们可以在后续的代码中使用jsonData变量来访问JSON数据。
指导意义
将JSON数据保存到变量中是一种良好的编程实践，因为它使得代码更易于维护和扩展。通过将数据保存到变量中，我们可以在需要时轻松地重新使用它们，而无需再次发出AJAX请求。
然而，需要注意的是，在获取数据之前，不能保证该数据已经被成功获取。因此，如果在后续的代码中依赖于该数据，则必须确保在数据可用之前不会执行这些代码。
示例代码
以下是一个完整的示例代码，它演示了如何使用jQuery的$.getJSON()方法将JSON数据保存到变量中，并在后续的代码中使用该变量：
--------- -----
------
------
----- ----------------
----------- ---- ---- -- ----------------
------- -----------------------------------------------------------
--------
--- ---------
---------------------- -------------- -
-- ---------
-------- - -----
---
-- -------------------
---------------------------- -
------------------------------------ -
-- --------
----------------------
---
---
---------
-------
------
------- ----------------------- -------------
-------
-------在这个示例中，我们定义了一个jsonData变量来保存从服务器获取的JSON数据。当页面加载时，它会调用$.getJSON()方法来获取数据，并将其保存到jsonData变量中。然后，它在页面上显示了一个按钮，当用户单击该按钮时，它将显示JSON数据。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/14028