zoukankan html css js c++ java

<Ajax> 五. xml数据解析

前端代码

<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<title>Title</title>
</head>
<body>
    <input type="submit" value="发送请求" id="name">
    <h3></h3>
</body>
</html>

<script src="./jquery-3.2.1.js"></script>
<script>
$(function () {
    $("#name").click(function() {
        // 创建请求对象
        var xhr = new XMLHttpRequest();

        // 请求行
        xhr.open("get", "postData.php");

        // 请求头

        // 回调函数
        xhr.onload = function() {
            console.log(xhr.responseText);
            console.log(xhr.responseXML);

            // 得到xml数据 
            var xml = xhr.responseXML;

            // 解析xml数据
            var name = xml.querySelector("name").innerHTML;
            var age = xml.querySelector("age").innerHTML;

            // 显示xml数据
            $("h3").text(name + "--" + age);
        };

        // 请求主体
        xhr.send(null);
    });
});
</script>

后端PHP代码

<?php
    // 设置格式
    header('content-type:text/xml;charset=utf-8');

    // 返回数据
    echo file_get_contents('data.xml');
?>

后端xml代码

<?xml version="1.0" encoding="UTF-8"?>
<root>
<name>RayLee</name>
<age>18</age>
</root>

查看全文

相关阅读:
Java后端知识体系
 HashMap底层实现整理
 Java线程池
 Spring Boot+Dubbo 入门
 Go 代码记录（一）
Servlet 复习
 Spring Cloud（二）Eureka：服务注册与发现
 Spring Cloud （一）概述
 数据结构基础知识
 容器技术-Docker入门

原文地址：https://www.cnblogs.com/ZeroHour/p/8342171.html