[Ajax] JSON数据格式

最新推荐文章于 2023-04-02 21:01:02 发布

^ω^奋斗小青年

最新推荐文章于 2023-04-02 21:01:02 发布

阅读量1.5k

点赞数 2

分类专栏： # 全面掌握Ajax 文章标签： json ajax html js

本文链接：https://blog.csdn.net/DeathDomain/article/details/108230543

版权

全面掌握Ajax 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

JSON是什么

JSON中文官网地址

是一种轻量级的数据交换格式

JSON是独立于任何语言的文本格式。易于程序员阅读和编写，同时也易于计算机解析和生成。

JSON语法规则

“名称/值”对的集合（Acollection of name/value pairs）。不同的语言中，它被理解为对象(object），纪录（record），结构（struct），字典（dictionary），哈希表（hash table ),有键列表（keyed list），或者关联数组（associative array）
值的有序列表（An ordered list of values）。在大部分语言中，它被理解为数组（array）。

值（value）可以是双引号括起来的字符串（string）、数值(number)、true、false、 null、对象（object）或者数组（array）。这些结构可以嵌套。

value

JSON中的键值对集合

JSON格式中的“名称/值”对的集合是一个无序的“‘名称/值’对”集合。一个对象以“{”（左括号）开始，“}”（右括号）结束。每个“名称”后跟一个“:”（冒号）;“‘名称/值’对”之间使用“,”（逗号）分隔。

在这里插入图片描述

JSON中的值的有序列表

数组是值（value）的有序集合。一个数组以 [左中括号开始， ]右中括号结束。值之间使用 ,逗号分隔。

在这里插入图片描述

JSON文件

JSON具有独立的文件，扩展名为“.json”。该文件中允许保存JSON格式的数据。

在写.json文件的时候,必须用" "不能够用' '

JavaScript中的JSON

JavaScript与JSON

JSON是一种语法，用来序列化对象、数组、数值、字符串、布尔值和null。它基于JavaScript语法，但与之不同:JavaScript不是JSON,JSON也不是JavaScript

JavaScript类型	JSON的不同点
对象和数组	属性名称必须是双引号括起来的字符串;最后一个属性后不能有逗号
数值	身出现前导零
字符串	只有有限的一些字符可能被转义

JSON字符串与JSON对象

JSON字符串就是指在JavaScript语言中内容格式符合JSON格式的字符串类型的数据。
JSON对象就是指JSON格式在JavaScript语言中的具体表现形式为对象或数组。

JavaScript的JSON对象

JSON.parse()方法:解析JSON字符串并返回对应的值。
JSON.stringify()方法:返回与指定值对应的JSON字符串。

JSON3下载地址

在这里插入图片描述

var jsonString = '{"name" :"张无忌"}';
    var jsonObject = JSON.parse(jsonString);
    console.log(jsonObject);
    var jsonResult =JSON.stringify(jsonObject);
    console.log(jsonResult);

Ajax中的JSON

构建JSON格式数据

通过Ajax向服务器端提交异步请求时，允许使用JSON格式的请求数据

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--<form action="" enctype="application/x-www-form-urlencoded"></form>-->
<button id='btn'>请求</button>
<script src="js/createXMLHttpRequest.js"></script>
<script>
    var btn = document.getElementById('btn')
    btn.addEventListener('click',function () {
        var xhr = createXMLHttpRequest()
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200){
                //1.接受数据-JSON数据格式，是字符串类型
                var data = xhr.responseText;
                //2.将符合JSON格式的字符串类型数据进行转换
                var json = JSON. parse(data);
                //3.进行具体处理
                console.log(json)
            }
        }

        xhr.open('post','server.json')

        xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded')

        var obj = {
            name:'周芷若',
            age:18
        }
        // var jsonString = JSON.stringify(obj)

        //将JSON字符串转换成符合请求数据的格式
        xhr.send('name=' + obj.name + '&age=' + obj.age)
    })
</script>
</body>
</html>

接收JSON格式数据

XML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<button id='btn'>请求</button>
<script src="js/createXMLHttpRequest.js"></script>
<script>
    var btn = document.getElementById('btn')
    btn.addEventListener('click',function () {
        var xhr = createXMLHttpRequest()
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200){
                //1.接受数据-responseXML属性->接收XML数据格式
                var data = xhr.responseXML;
                //2.利用DOM解析XML即可
                var nameElement = data.getElementsByTagName('name')[0]
                console.log(nameElement);
            }
        }

        xhr.open('post','server.xml')
        xhr.send(null)
    })
</script>

</body>
</html>

^ω^奋斗小青年

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
[Ajax] JSON数据格式

JSON是什么JSON是什么JSON中文官网地址是一种轻量级的数据交换格式JSON是独立于任何语言的文本格式。易于程序员阅读和编写，同时也易于计算机解析和生成。 JSON语法规则“名称/值”对的集合（Acollection of name/value pairs）。不同的语言中，它被理解为对象(object），纪录（record），结构（struct），字典（dictionary），哈希表（hash table ),有键列表（keyed list），或者关联数组（associat
复制链接

扫一扫