简单了解JavaScript操作XPath的一些基本方法

Xpath现在很少被我们使用,因为JSON现在很盛行。可是在XML做为数据交换格式的年代,Xpath在我们随机访问大的xml文档结构的时候扮演着非常重要的位置。也许大家现在很多没有注意到,DOM Level 3 XPath指定的接口已经被Firefox,Safari, Chrome, and Opera实现了。他们所实现的核心接口就是XPathEvaluator,它包含一些能够使用xpath表达式进行工作的方法,最主要的方法就是evaluate(),它能够接受五个参数1.xpath查询字符串2.指明xpath查询字符串应该从哪个节点开始3.命名空间解析器(稍后介绍)4.返回的结果类型5.返回的结果应该添加到那个对象上(很少被使用,因为结果主要通过evaluate()返回)。

主要有10中不同的返回类型。每一种就代表XPathResult对象的一个常量。

  • XPathResult.ANY_TYPE     适合于xpath表达式的数据类型
  • XPathResult.ANY_UNORDERED_NODE_TYPE     返回匹配节点的集合,顺序可能和文档中的不一样。
  • XPathResult.BOOLEAN_TYPE 返回boolean类型
  • XPathResult.FIRST_ORDERED_NODE_TYPE 返回文档中匹配节点的第一个节点。
  • XPathResult.NUMBER_TYPE 返回num类型
  • XPathResult.ORDERED_NODE_ITERATOR_TYPE返回匹配节点的集合,顺序和文档中的一样
  • XPathResult.ORDERED_NODE_SNAPSHOT_TYPE返回一个节点集合片段,在文档外捕获节点,这样将来对文档的任何修改不会影响节点集合。节点集合中的顺序要和文档中的一样。
  • XPathResult.STRING_TYPE 返回一个string类型
  • XPathResult.UNORDERED_NODE_ITERATOR_TYPE 返回匹配节点的集合,顺序可能和文档中的不一样。
  • XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE 返回一个节点集合片段,在文档外捕获节点,这样将来对文档的任何修改不会影响节点集合。节点集合中的顺序没有必要和文档中的一样。

介绍了这么多,那么我们该如何使用这些api进行操作呢?
evaluate()函数返回的信息完全依赖于请求的结果类型。
为了执行xpath查询,需要使用XPathEvaluator对象,你可以生成一个新的对象也可以使用内置的对象,如果生成一个新的对象就要初始化XPathEvaluator。

var evaluator = new XPathEvaluator();
//得到第一个div
var result = evaluator.evaluate("//div", document.documentElement, null,
         XPathResult.FIRST_ORDERED_NODE_TYPE, null);
alert("First div ID is " + result.singleNodeValue.id);

在Firefox, Safari, Chrome, and Opera,所有的文档实例都实现了XPathEvaluator接口,这样的话如果在HTML页面中执行的查询的话,我们可以使用document.evaluate(),如果通过XMLHttpRequest或者其他机制得到XML文档,evaluate()方法也可以使用,例如:

//get first div
var result = document.evaluate("//div", document.documentElement, null,
         XPathResult.FIRST_ORDERED_NODE_TYPE, null);
alert("First div ID is " + result.singleNodeValue.id);

下面介绍两种返回多节点的方式,还是先看看实例:

//get all divs - iterator style
var result = document.evaluate("//div", document.documentElement, null,
         XPathResult.ORDERED_NODE_ITERATOR_TYPE, null);
if (result){
  var node = result.iterateNext();
  while(node) {
    alert(node.id);
    node = node.iterateNext();
  }
}
//get all divs - SNAPSHOT style
var result = document.evaluate("//div", document.documentElement, null,
         XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
if (result){
  for (var i=0, len=result.snapshotLength; i < len; i++) {
    alert(result.snapshotItem(i).id);
  }
}

命名空间
如果你只是使用xpath在html文档中简单的查询,evaluate()中的命名空间解析器参数一般为null,如果你倾向于使用xpath在包含命名空间的xml文档中查询,那么你应该学会怎样创建和使用命名空间解析器。
除了默认的命名空间以外,每个命名空间URI都映射到一个指定的前缀。每一个命名空间解析器是为xpath引擎在命名空间前缀和命名空间uri之间进行映射。有两种生成命名空间解析器的方法,第一种如下:创建一个接受命名空间前缀作为参数的方法,然后返回对应的url ,如下:

function resolver(prefix){
  switch(prefix){
    case "wrox": return "http://www.wrox.com/";
    case "ncz": return "http://www.nczonline.net/";
    default: return "http://www.yahoo.com/";
  }
}

第二种使用一个包含命名空间信息的节点,来生成一个命名空间解析器。

<books xmlns:wrox="http://www.wrox.com/" xmlns="http://www.amazon.com/">
  <wrox:book>Professional JavaScript</book>
</books> 

<books>元素包含了所有的命名空间信息,你可以把这个节点的引用传给XPathEvaluator对象的createNSResovler()方法,然后可以自动的得到一个命名空间解析器。
如:

var evaluator = new XPathEvaluator();
var resolver = evaluator.createNSResolver(xmldoc.documentElement);

使用上面的任意一个方法可以很容易的在含有命名空间xml文档中进行查询。

var evaluator = new XPathEvaluator();
var resolver = evaluator.createNSResolver(xmldoc.documentElement);
var result = evaluator.evaluate("wrox:book", xmldoc.documentElement,
         resolver, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
if (result){
  alert(result.singleNodeValue.firstChild.nodeValue);
}

注意:如果你在含有命名空间的xml文当中执行查询,不提供命名空间解析器,就会发生错误。

IE浏览器中对xpath的支持
IE8还没有实现DOM Level 3 XPath中定义的接口,但是它对xpath也有一定的支持,IE中的xpath功能主要对xml文档可用,对document的对象不可用。
在IE中生成xml文档的方法:

function createDocument(){
  if (typeof arguments.callee.activeXString != "string"){
    var versions = ["MSXML2.DOMDocument.6.0",
            "MSXML2.DOMDocument.3.0",
            "MSXML2.DOMDocument"];
    for (var i=0,len=versions.length; i < len; i++){
      try {
        var xmldom = new ActiveXObject(versions[i]);
        arguments.callee.activeXString = versions[i];
        return xmldom;
      } catch (ex){
        //skip
      }
    }
  }
  return new ActiveXObject(arguments.callee.activeXString);
}

生成文档对象以后,可以使用loadXML()方法加载内容:

var xmldoc = createDocument();
xmldoc.loadXML("");

第二种方法通过XMLHttRequest对象进行请求生成xml对象。

var xhr = new XMLHttpRequest(),
  xmldoc;
xhr.open("get", "data.xml", true);
xhr.onreadystatechange = function(){
  if (xhr.readyState == 4){
    if (xhr.status >= 200 && xhr.status < 300){
      xmldoc = xhr.responseXML;
    }
};
xhr.send(null); 

第三种方法是使用<xml>标签,Microsoft把这种方法叫做xml数据岛,如下:

<xml id="myXML" src="data.xml"></xml>

然后:

var xmldoc = document.getElementById("myXML").XMLDocument;

XPath支持:
在ie中的xml文档对象对xpath进行支持有两个内置方法:
selectSingleNode() and selectNodes(),每个方法都接受xpath表达式作为参数,然后分别放回第一个匹配的节点和所有匹配的节点。
命名空间支持:
对于

<books xmlns:wrox="http://www.wrox.com/" xmlns="http://www.amazon.com/">
  <wrox:book>Professional JavaScript</book>

</books>这段xml文档,我们应该使用下面的方法进行查询,即首先使用setProperty(),来设置xml文档的命名空间。

xmldoc.setProperty("SelectionNamespaces",
  "xmlns:wrox='http://www.wrox.com/' xmlns='http://www.amazon.com/'");
var book = xmldoc.documentElement.selectSingleNode("wrox:book");
(0)

相关推荐

  • DOM XPATH获取img src值的query

    复制代码 代码如下: $nodes = @$xpath->query("//*[@id='main_pr']/img/@src");$prurl = $nodes->item(0)->nodeValue;

  • XPath入门 - XSL教程 - 3

    什么是XPath   XPath(可扩展路径) 是给 XSL 转换[XSLT]和 XPointer [XPointer]的共享功能提供一个共用的句法及语义的结果.XPath的主要的目是用于对 XML 文档元件寻址.在支持这个主要目的的同时,它也为字符串,数字和布尔的操作提供了基本手段.XPath 使用简明的.非 XML 句法以便於在 URIs 和 XML 属性值以内使用 XPath,XPath 对 XML 文档的抽象的.逻辑的结构而非它的表面句法进行操作,XPath 的名字源于它在 URL 中用

  • 使用HtmlAgilityPack XPath 表达式抓取博客园数据的实现代码

    Web 前端代码 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.

  • xpath的数据和节点类型以及XPath中节点匹配的基本方法

    XPath数据类型 XPath可分为四种数据类型: 节点集(node-set) 节点集是通过路径匹配返回的符合条件的一组节点的集合.其它类型的数据不能转换为节点集. 布尔值(boolean) 由函数或布尔表达式返回的条件匹配值,与一般语言中的布尔值相同,有true和 false两个值.布尔值可以和数值类型.字符串类型相互转换. 字符串(string) 字符串即包含一系列字符的集合,XPath中提供了一系列的字符串函数.字符串可与数值类型.布尔值类型的数据相互转换. 数值(number) 在XPa

  • JQuery 选择器 xpath 语法应用

    比如下面html代码 复制代码 代码如下: <ul> <li class="aaaa" title="ttt">li-1</li> <li class="bbbb">li-2</li> <li title="fffff">li-2</li> </ul> <div class="aaaa" title=&qu

  • 简单了解JavaScript操作XPath的一些基本方法

    Xpath现在很少被我们使用,因为JSON现在很盛行.可是在XML做为数据交换格式的年代,Xpath在我们随机访问大的xml文档结构的时候扮演着非常重要的位置.也许大家现在很多没有注意到,DOM Level 3 XPath指定的接口已经被Firefox,Safari, Chrome, and Opera实现了.他们所实现的核心接口就是XPathEvaluator,它包含一些能够使用xpath表达式进行工作的方法,最主要的方法就是evaluate(),它能够接受五个参数1.xpath查询字符串2.

  • SQLSERVER简单创建DBLINK操作远程服务器数据库的方法

    本文实例讲述了SQLSERVER简单创建DBLINK操作远程服务器数据库的方法.分享给大家供大家参考,具体如下: --配置SQLSERVER数据库的DBLINK exec sp_addlinkedserver @server='WAS_SMS',@srvproduct='',@provider='SQLOLEDB',@datasrc='10.131.20.100' exec sp_addlinkedsrvlogin 'WAS_SMS','false', NULL,'CustomSMS','Sql

  • javascript操作ul中li的方法

    本文实例讲述了javascript操作ul中li的方法.分享给大家供大家参考.具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> &l

  • JavaScript操作 url 中 search 部分方法函数

    前言 首先,我们需要知道什么是 search , search 是 window.location 的一个属性.举个例子: 首先,我们这里有一个 url,是 http://www.a.com/list/2.html?page=2&color=4&size=3#pic. 我们访问访问这个地址,打开控制台,输入window.location,会得到如下图的结果 如上,我们要操作的就是上图中方框框出来的这个部分. 为什么要操作这个? 例如,我在第二页,需要跳转到第三页,就需要把上面的 page=

  • 简单介绍JavaScript中字符串创建的基本方法

    创建一个字符串有几种方法.最简单的是用引号将一组字符包含起来,可以将其赋值给一个字符串变量. var myStr = "Hello, String!"; 可以用双引号或单引号将字符串包含,但要注意,作为界定字符串的一对引号必须是相同的,不能混用. 像var myString = "Fluffy is a pretty cat.'; 这样的声明就是非法的. 允许使用两种引号,使得某些操作变得简单,比如将一种嵌入另外一种: document.write("<img

  • JavaScript操作选择对象的简单实例

    JavaScript操作选择对象的简单实例 //替换选中文本内容,参数text为要替换的内容 function SetSelectionText(text) { //非IE浏览器 if (window.getSelection) { var sel = window.getSelection(); alert(sel.rangeCount); //选区个数, 通常为 1 . sel.deleteFromDocument(); //清除选择的内容 var r = sel.getRangeAt(0)

  • JavaScript使用setInterval()函数实现简单轮询操作的方法

    本文实例讲述了JavaScript使用setInterval()函数实现简单轮询操作的方法.分享给大家供大家参考.具体分析如下: 轮询(Polling)是一种CPU决策如何提供周边设备服务的方式,又称"程控输出入"(Programmed I/O).轮询法的概念是,由CPU定时发出询问,依序询问每一个周边设备是否需要其服务,有即给予服务,服务结束后再问下一个周边,接着不断周而复始.轮询法实作容易,但效率偏低. 在JavaScript使用setInterval函数作简单的轮询操作,可以随时

  • 在Javascript操作JSON对象,增加 删除 修改的简单实现

    在Javascript操作JSON对象,增加删除修改全有的,详情见代码 <script type="text/javascript"> var jsonObj2 = { teacher: [ { name: "jordan", sex: "m", age: "40" }, { name: "bryant", sex: "m", age: "28" }, {

  • JavaScript实现的简单加密解密操作示例

    本文实例讲述了JavaScript实现的简单加密解密操作.分享给大家供大家参考,具体如下: JavaScript实现对内容的加密和解密.加密,转成编码.解密则是编码转字符串. <html> <head> <meta charset="utf-8" /> <title>www.jb51.net JS加密解密</title> </head> <body> <h1> 加密解密 </h1>

  • Javascript操作cookie的函数代码

    javascript操作cookie简单版本 复制代码 代码如下: function setCookie(name, value, iDay) { var oDate = new Date(); oDate.setDate(oDate.getDate() + iDay); document.cookie = name+'='+value+';expires='+oDate; } function getCookie(name) { var arr = document.cookie.split(

随机推荐