前端 json ajax

josn是将前端与后端服务器进行交互的一种文本格式(字符串)

url的地址值被解析成json字符串,穿个后端服务器

1.28.4  转换

JSON已经作为浏览器内置支持,所以我们可以直接使用JSON对象:

l  json转obj        JSON.parse("json")  //将json串转换为对象

l  obj转json            JSON.stringify(obj)   //将对象转换json串

https://p.3.cn/prices/mgets?skuIds=J_100003717483 

json 字符串

[{"cbf":"0","id":"J_100003717483","m":"10000.00","op":"2499.00","p":"2099.00"}] 

格式化json

[

  {

      "cbf":"0",

      "id":"J_100003717483",

      "m":"10000.00",

      "op":"2499.00",

      "p":"2099.00"

  }

]

json的存储中是用k,v(值对)的形式进行存储 ;

JSON 值可以是

数字(整数或浮点数)

字符串(在双引号中)

逻辑值(true 或 false)

数组(在方括号中)

对象(在花括号中)

null

但json的值无论是什么形式都必须使用双引号括起来

"key" : "value"

如果有一个值对   var p=' "name" : "json" ';

如果有多个那么var p ='{"name" : "json" , "age" : "33"}'

如果有多个json串对象 var p='[{"name" : "json" , "age" : "33" },{"sex" : "男"}]'

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,主要用于传送数据。
JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串,然后就可以在函数之间轻松地传递这个字符串,或者在异步应用程序中将字符串从 Web 客户机传递给服务器端程序。这个字符串看起来有点儿古怪,但是 JavaScript 很容易解释它,而且 JSON 可以表示比"名称 / 值对"更复杂的结构。例如,可以表示数组和复杂的对象,而不仅仅是键和值的简单列表。

JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)。这些特性使JSON成为理想的数据交换语言。易于人阅读和编写,同时也易于机器解析和生成。

AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术

$.ajax({
    type:  //要使用的请求方式
    url:  //要使用的请求路径 
    contentType: //要传递的数据类型(网页,图片,音频,视频等)
    data:  //要拼接的数据
    dataType:  //数据类型
    success: function(data){ //成功时的方案 
        
    },
    error: function(data){ //失败时的方案
        
    }
})
 

ajax.html案例

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery-1.8.3.min.js"></script>
	<script>
		$(function(){//文档就绪事件
			$.ajax({ //发起Ajax请求数据
				type: "POST",
				url: "https://p.3.cn/prices/mgets",
				contentType: "application/json;charset=utf-8",
				data: {		//拼接的参数
					"skuIds": "J_100003717483"
				},
				dataType: "json",
				success: function(data) {	//返回的结果
//[{"cbf":"0","id":"J_100003717483","m":"10000.00","op":"2499.00","p":"2099.00"}]
					$('#p1').text("返回数据:" + JSON.stringify(data));
					$('#p2').text("商品编号:" + data[0].id);
					$('#p3').text("商品价格: " + data[0].op);
				},
				error: function(data) {
					alert("提交失败" + JSON.stringify(data));
				}
			});
		});

	</script>
</head>
<body>
	<p id="p1">这是p1</p>
	<p id="p2">这是p2</p>
	<p id="p3">这是p3</p>
</body>
</html>

json和js对象的区别

json字符串: { "id":"100","name":"tony","salary":"30000" }
js对象:{ "id":100,"name":"tony","salary":30000 }

可以看出js对象中value值如果是整数,小数,无需加双引号

含义不同,json是一种数据格式,js表示类的实例
传输:json用于跨平台、跨网络传输,速度快;js不能传输
展现:json键值对方式,值是字符串不能是对象方法函数;js值不一定加双引号,值可以是对象、函数、字符串等
转换:eval(json);  JSON已经转换为浏览器内置对象

  json转obj        JSON.parse("json")  //将json串转换为对象

  obj转json            JSON.stringify(obj)   //将对象转换json串

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值