首页 > 其他分享 >ajax请求json和xml数据及对json和xml格式数据的解析

ajax请求json和xml数据及对json和xml格式数据的解析

时间:2023-01-16 17:34:16浏览次数:49  
标签:xml data ajax json 解析 数据


ajax请求json和xml数据及对json和xml格式数据的解析

  • ​​一、ajax请求json数据并解析​​
  • ​​ajax的写法:​​
  • ​​json数据解析:​​
  • ​​请求json经常出现的跨域报错:​​
  • ​​二、ajax请求xml数据并解析​​
  • ​​ajax的写法:​​
  • ​​xml数据解析:​​

最近写插件的时候,遇到xml格式的数据,以前用xml比较少,一直都是json格式。这里对json和xml做个总结。

一、ajax请求json数据并解析

ajax的写法:

$.ajax({
url: 'url',//接口的url
type: 'POST',
dataType: 'json',//返回数据的类型是json
success : (data) => {
console.log(data);//data是返回的数据,是String格式
let result=JSON.stringify(data); //将data转换成json格式
},
error : () => {
alert('请求失败');
}
});

json数据解析:

例如上面代码,success回调函数中取得了json格式的数据result。假设数据为:

{
id : 'mike',
name : 'laowang',
datas :
[
[age : 1, passw : 'hhh'],
[age : 2, passw : 'gghh']
]
}

解析数据只要用点(.)就行了。

result.id; //mike
result.datas[1]; // [age : 2, passw : 'gghh']

请求json经常出现的跨域报错:

​Access to XMLHttpRequest at ‘http://xxxx.com/xxx’ from origin ‘null’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.​​ 有时候一些接口经常会出现这个错误。解决方案是把dataType的值json改为jsonp。

二、ajax请求xml数据并解析

ajax的写法:

这个和json差不多,就是把数据格式改成xml。

$.ajax({
url: 'url',//接口的url
type: 'POST',
dataType: 'xml',//返回数据的类型是json
success : (data) => {
console.log(data);//data是返回的数据,类似于一个xml文件
},
error : () => {
alert('请求失败');
}
});

xml数据解析:

xml数据的解析,推荐使用jQuery里面的方法。
如上代码,在success的回调函数拿到数据data之后。假设格式如下:

<?xml version="1.0" encoding="UTF-8"?>
<resp>
<city>北京</city>
<updatetime>16:27</updatetime>
<shidu>23%</shidu>

<yesterday>
<date_1>18日星期六</date_1>
<high_1>高温 3℃</high_1>
<low_1>低温 -4℃</low_1>
<day_1>
<type_1>多云</type_1>
</day_1>
<night_1>
<type_1>晴</type_1>
</night_1>
</yesterday>

<forecast>
<weather>
<date>19日星期天</date>
<high>高温 6℃</high>
<low>低温 -4℃</low>
<day>
<type>晴</type>
</day>
<night>
<type>晴</type>
</night>
</weather>

<weather>
<date>20日星期一</date>
<high>高温 5℃</high>
<low>低温 -6℃</low>
<day>
<type>晴</type>
</day>
<night>
<type>多云</type>
</night>
</weather>
</forecast>
</resp>

解析xml的写法一般为:主要是​​$().find().each()​​方法,注意这是一个循环方法

$(data).find("resp").each(function(){//在data里面找resp标签
let updateTime=$(this).find("updatetime").text();//把updatetime标签里面的值取出来
});


标签:xml,data,ajax,json,解析,数据
From: https://blog.51cto.com/u_15942590/6010582

相关文章

  • AJAX——方法及属性
    XMLHttpRequest对象方法:方法描述newXMLHttpRequest()创建新的XMLHttpRequest对象abort()取消当前请求getAllResponseHeaders()返回头部信息getResp......
  • MyRadio_1.0.90\assets的JSON配置文件。
    [{"stationuuid":"9616a843-0601-11e8-ae97-52543be04c82","name":"NHKFM","url":"https://nhkradioakfm-i.akamaihd.net/hls/live/512290/1-fm/1-f......
  • springboot返回json和xml
    在项目中某些情况下接口需要返回的是xml数据或者json数据1、在springboot项目加入依赖jackson-dataformat-xml<dependency><groupId>com.fasterxml.jacks......
  • Java对象转JSON动态设置字段
    需求User类:@DatapublicclassUser{ privateStringname; privateIntegerage;}序列化成JSON时,处理动态增加一个sex字段{ "name":"张三", "age":20, "sex......
  • [VS Code] 解决JSON文件注释提示Comments are not permitted in JSON.
    问题:打开JSON文件,发现注释中出现一堆问题提示,鼠标指示上去提示CommentsarenotpermittedinJSON.  解决:1.点击右下角的JSON. 2.输入json,找到jsonc并点击......
  • springboot之json/yml配置文件的读取
    配置文件读取项目根目录的config目录下person.yml,文件夹如下person:name:qinjiangage:3happy:falsebirth:2000/01/01maps:{k1:v1,k2:v2}lis......
  • JSON
    1.概念:JavaScriptObjectNotation  JavaScript对象表示法   varp={"name":"zhangsan","age":23,"sex":"男"}    *json现在多用于储存和交换文本信息的语法......
  • AJAX使用记录
    目录什么是AJAXAJAX的工作流程省市二级联动案例AJAX的使用总结什么是AJAXAJAX=AsynchronousJavaScriptAndXML.我感觉AJAX是一个有点误导性的名称。让人觉得AJA......
  • django获取ajax POST 数据失败可能原因
    ajaxPOST发送简单的数据后台是可以接收到的,比如下面简单的字典和列表后台就能接收到。//前端:$.ajax({...data:{name:1,age:2,xx=[1,2,3]}}......
  • c#读取xml文件的一个节点
    我的xml文件内容很简单,如下所示:<?xmlversion="1.0"encoding="utf-8"?><connString>DataSource=.;InitialCatalog=KTV;PersistSecurityInfo=True;UserI......