xml数据格式，简单入门了解

xml数据格式理解：元数据：描述数据的数据弊端：1. 元数据占用的数据量比较大，不利于大量数据的网络传输2.解析不太方便<?xml version="1.0" encoding="utf-8"?><booklist><book><name>微习惯</name><author>斯蒂芬.盖斯</author><d

不落不息

764人浏览 · 2020-10-02 19:37:22

不落不息 · 2020-10-02 19:37:22 发布

xml数据格式

理解：
元数据：描述数据的数据
弊端：
1. 元数据占用的数据量比较大，不利于大量数据的网络传输
2.解析不太方便

<?xml version="1.0" encoding="utf-8"?>
<booklist>
	<book>
		<name>微习惯</name>
		<author>斯蒂芬.盖斯</author>
		<desc>微习惯养成法</desc>
	</book>
	<book>
		<name>水果</name>
		<author>自然</author>
		<desc>讲述水果在大自然中的作用</desc>
	</book>
</booklist>

获取xml数据，post请求方式

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>ajax</title>
	<script type="text/javascript">
		window.onload=function(){
			var btn =document.getElementById("btn");
			btn.onclick =function(){
				//post请求参数由send传递
			    var user = document.getElementById("username").value;
			    var pw = document.getElementById("pw").value;
			    var param = 'username='+user+'&password='+pw;

				// 1.创建XMLHttpRequest对象
			    var xhr = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
			    // 2.准备发送
			    xhr.open('post','data.xml',true);
			    // 3.在open之后设置请求头,一定要设置
			    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
			    //4.执行发送
			    xhr.send(param);//不需要转码
			    //5.指定回调函数
			    xhr.onreadystatechange = function(){
			    	if (xhr.readyState == 4) {
			    		if(xhr.status >= 200 && xhr.status < 300 || xhr.status ==304 ){
			    			var xmldata =xhr.responseXML;
			    			var bookList =xmldata.getElementsByTagName("booklist");
			    			// console.log(bookList[0]);// 与js方法相同
			    			
			    			// var books =bookList[0].childNodes;
			    			// console.log(books); //会包括换行
			    			// console.log(books[0].nodeType);
			    			// console.log(books[0]);

			    			// var  books= bookList[0].children;
			    			// console.log(books); 
			    			// console.log('书名:《'+books[0].children[0].innerHTML+'》');
			    			// console.log('另一种获取方法:书名：《'+books[0].children[0].firstChild.wholeText+'》');
			    		}
			    	}
			    }

			}
		}
	</script>
</head>
<body>
	<div>测试页面</div>
	<div>
		<!-- form默认method为get -->
		<form>
		姓 名：<input type="text" name="username" id="username"><br>
		密 码：<input type="password" name="pw" id="pw"><br>
		<input type="button" value="登录" id="btn"><br>
		<span id="info"></span>
		</form>
	</div>

</body>
</html>

php结合xml数据

将上面的open请求路径改为xx.php

<?php  
  header("Content-Type:text/xml");//一定要设置响应头信息，否则浏览器不能识别xml
  $arr =array();
  $arr[0]=array("name"=>"微习惯","author"=>"斯蒂芬.盖斯","desc"=>"微习惯养成发");
  $arr[1]=array("name"=>"水果","author"=>"自然","desc"=>"讲述水果在大自然中的作用");
?>
<?xml version="1.0" encoding="utf-8"?>
<booklist>
	<book>
		<name><?php echo $arr[0]['name']; ?></name>
		<author><?php echo $arr[0]['author']; ?></author>
		<desc><?php echo $arr[0]['desc']; ?></desc>
	</book>
	<book>
		<name><?php echo $arr[1]['name']; ?></name>
		<author><?php echo $arr[1]['author']; ?></author>
		<desc><?php echo $arr[1]['desc']; ?></desc>
	</book>
</booklist>