JSON 学习笔记

当你需要根据服务器返回的数据来动态改变页面的时候，应用程序接口(API)就派上用场了。

记住，API——应用程序接口(Application Programming Interface)是计算机之间相互交流沟通的工具。

许多网站的应用程序接口(API)都是通过一种称为JSON格式的数据来传输的，JSON 是 JavaScript Object Notation的简写。

 

它通常表现为了两种形式，一种为单个对象，一种为多个对象

单个对象类似于：
{name:'盖伦',advantage:'单挑无敌'}

多个对象类似于：
[{name:'盖伦',advantage:'单挑无敌'},{name:'诺克',advantage:'上单霸主'}]

 

jQuery.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )

描述: 使用一个HTTP GET请求从服务器加载JSON编码的数据。

• url
  类型: String
  一个包含发送请求的URL字符串
• data
  类型: PlainObject or String
  一个普通的对象或字符串，用来发送请求给服务器。
• success
  Type: Function( PlainObject data, String textStatus, jqXHR jqXHR )
  当请求成功后执行的回调函数。

//从之前的猫图API拿取数据：

$.getJSON("/json/cats.json", function(json) {
　　$(".message").html(JSON.stringify(json));
});

https://www.freecodecamp.cn/challenges/get-json-with-the-jquery-getjson-method

JSON.stringify 语法讲解

 

使用.forEach()函数来循环遍历JSON数据

json.forEach(function(val) {

　　html += "<div class = 'cat'>"

　　html += "<img src = '" + val.imageLink + "'>"

　　html += "</div>"

});

 

过滤.filter

json = json.filter(function(val) {
　　return (val.id !== 1);
});