Ajax中的JSON

构建JSON格式数据

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Ajax中的JSON</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. 接收数据 - 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,};xhr.send("name=" + obj.name + "&age=" + obj.age);});</script></body>
</html>

返回结果如下

接收JSON格式数据

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Ajax中的JSON</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. 接收数据 - JSON数据格式，是字符串类型var data = xhr.responseText;// 2. 将符合JSON格式的字符串类型数据进行转换var json = JSON.parse(data);// 3. 进行具体处理console.log(json);}};xhr.open("get", "server.json");xhr.send(null);});</script></body>
</html>

补充 XML

xml文件

<?xml version="1.0" encoding="utf-8" ?>
<body><name>张无忌</name>
</body>

Ajax中的XML

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Ajax中的XML</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.textContent); // 张无忌}};xhr.open("get", "server.xml");xhr.send(null);});</script></body>
</html>

Ajax中的JSON相关推荐

Ajax中获取Json的list集合后进行遍历读取并显示的实例
对于json数据的遍历有以下两种方式 var person = {"name": "张三", age: 23, 'gender': true};var ps = ...
ajax中datatype是json,dataType：'json'vs data：$ .ajax中的JSON.stringify（obj）
我有这个数据结构: var formValues = { TemporaryToken: a.userStatus.get("TemporaryToken"), Memorable ...
ajax 中$.each(json,function(index,item){ }); 中的2个参数表示什么意思?
$.each(json,function(index,item) 里面的index代表当前循环到第几个索引,item表示遍历后的当前对象,比如json数据为:[{"name":&q ...
Ajax系列之JSON数据格式
JSON数据格式 JSON是什么 JSON是一种轻量级的数据交换格式 JSON文件时独立的,扩展名是".json"该文件中允许保存JSON格式的数据注意: 在JSON文件中字符串 ...
ajax解析json中的对象数组对象,在JQuery中检索json数组后获取json对象Ajax
我使用JQuery AJAX检索某些数据(标题和说明).正如你可以看到我打通的结果,并出结果的JSON数组和循环div标签中在JQuery中检索json数组后获取json对象Ajax success ...
Ajax（从json中提取数据）
2019独角兽企业重金招聘Python工程师标准>>> json数据为: out.println("{name:'平凡的世界',author:'路遥'}");aj ...
ajax中json响应
回到文章总目录 ajax中json响应在实际工作当中我们向服务端发送请求,服务端返回来的大部分都是json格式的数据本篇文章讲解的是怎么去处理json格式的数据本次使用的按键为下箭头当按键盘 ...
ajax怎样获取json数据,如何使用ajax读取Json中的数据
本文给大家分享一下,如何使用ajax读取Json中的数据. 一.基础知识什么是json? JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) ...
Ajax如何设置contenttype,ajax中设置contentType: application/json的作用
最近在做项目交互的时候,刚开始向后台传递数据返回 415 ,后来百度添加了 contentType:"application/json" 之后返回400,然后把传输的数据格式改为j ...

Ajax中的JSON

Ajax中的JSON

构建JSON格式数据

接收JSON格式数据

补充 XML

Ajax中的JSON相关推荐

最新文章

热门文章