html学习笔记-XML-Javascript

html学习笔记-XML-Javascript

Table of Contents

1. XML HTTP Request

1.1. XMLHttpRequest 对象

1.2. 创建 XMLHttpRequest 对象

2. XML 解析器

3. XML DOM

1 XML HTTP Request

1.1 XMLHttpRequest 对象

XMLHttpRequest 对象用于在后台与服务器交换数据。

在不重新加载页面的情况下更新网页

在页面已加载后从服务器请求数据

在页面已加载后从服务器接收数据

在后台向服务器发送数据

1.2 创建 XMLHttpRequest 对象

所有现代浏览器 (IE7+、Firefox、Chrome、Safari 以及 Opera) 都内建了 XMLHttpRequest 对象。

<script type="text/javascript">
var xmlhttp;
function loadXMLDoc(url)
{
xmlhttp=null;
if (window.XMLHttpRequest)
{// code for all new browsers
xmlhttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{// code for IE5 and IE6
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlhttp!=null)
{
xmlhttp.onreadystatechange=state_Change;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
else
{
alert("Your browser does not support XMLHTTP.");
}
}


function state_Change()
{
if (xmlhttp.readyState==4)
{// 4 = "loaded"
if (xmlhttp.status==200)
{// 200 = OK
// ...our code here...
}
else
{
alert("Problem retrieving XML data");
}
}
}
</script>

2 XML 解析器

所有现代浏览器都内建了供读取和操作 XML 的 XML 解析器。

解析器把 XML 转换为 XML DOM 对象 - 可通过 JavaScript 操作的对象。

跨域访问

出于安全方面的原因，现代的浏览器不允许跨域的访问。

这意味着，网页以及它试图加载的 XML 文件，都必须位于相同的服务器上。

3 XML DOM

DOM 把 XML 文档作为树结构来查看。能够通过 DOM 树来访问所有元素。可以修改或删除它们的内容，并创建新的元素。元素，它们的文本，以及它们的属性，都被认为是节点。

xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue

# 例子中，我们使用 DOM 引用从 <to> 元素中获取文本：
#   xmlDoc -由解析器创建的 XML 文档
#   getElementsByTagName("to")[0] - 第一个 <to> 元素
#   childNodes[0] - <to> 元素的第一个子元素（文本节点）
#   nodeValue - 节点的值（文本本身）

Author: galaxy

Created: 2015-09-23 Wed 17:18

Emacs 24.4.1 (Org mode 8.2.10)

Validate