ajax--xml和json

xml:可扩展标记语言

  1. 作用:传输数据(HTML用来显示数据)
  2. 没有预定义标签,需要自定义标签
  3. xml是纯文本文件
  4. xml第一行需要声明<?xml version="1.0" encoding="UTF-8" ?>
  5. 需要自定义根标签。而且所有标签必须闭合
    以下是一个xml文件示例:
<?xml version="1.0" encoding="UTF-8" ?> //xml声明
<person> //自定义一个根标签 类似于html中的<html></html>根标签
    <name>jiaody</name> //自定义子标签
    <age>47</age>//通过querySelector获取标签,通过innerHTML获取子标签的内容
</person>

ajax中xml使用:

html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="ajax2.js"></script>
    <script>
        window.onload = function() {
            var btn = document.querySelector('button');
            btn.onclick = function () {
                ajax({
                    url: "11-ajax-xml.php",
                    timeout: 3000,
                    type: "get",
                    success: function (xhr) {
                       var xml = xhr.responseXML; //通过responseXML获取返回的xml文件 
                       console.log(xml.querySelector('name').innerHTML);//jiaody
                       console.log(xml.querySelector('age').innerHTML);//46
                    },
                    error: function (xhr) {
                        alert("请求失败");
                    }
                });
            }
        }
    </script>
</head>
<body>
<button>发送请求</button>
</body>
</html>

php:

<?php
// 执行结果中有中文, 必须在php文件顶部设置
// 如果PHP中需要返回XML数据, 也必须在PHP文件顶部设置
header("content-type:text/xml; charset=utf-8");
echo file_get_contents("info.xml");
//file_get_contents(url) 将url中的内容读取到一个字符串中

info.xml

<?xml version="1.0" encoding="UTF-8" ?>
<person>
    <name>jiaody</name>
    <age>46</age>
</person>

json

JSON.parse(str) 传入json字符串,返回将该字符串解析的对象 通过 .属性名获取属性值

非标准的JSON字符串: {error: 0, id: 1, time: 1526541587, acc: 0, ref: 0}
标准的JSON字符串: {"error": "0", "id": "1", "time": "1526541587", "acc": "0", "ref": "0"}
如果通过JSON.parse()转换非标准的json字符串,会报错VM179:1 Uncaught SyntaxError: Unexpected token e in JSON at position 1
在这种情况下,一般使用eval("("+json字符串+")") 将其转化成obj对象
发布了119 篇原创文章 · 获赞 1 · 访问量 3967

猜你喜欢

转载自blog.csdn.net/weixin_42139212/article/details/103547849