Is there a JS library to provide xpath capacities to IE
I am doing a lot of XPath with "normal & modern" browser (FF, Chrome, Opera, Safari...) but I'm looking for a javascript library which allow IE to support document.evaluate()
method.
Does it exist ? I know there are some similar questions in StackOverflow, but they were asked & answered many years ago.
The idea is to: factorize the code in reading xpath & also producing (same) xpath.
Update, 8th August 2011:
I find the lib proposed by @ExtremeCoder here : http://sourceforge.net/projects/html-xpath/
This is really what I need (it "override" document.evaluate only for IE)... but it creates bug on chrome & it doesn't work more on IE :/
Update 29 August 2012 (yeah, one year after).
I test a wide range of library. A lot of those which override document.evaluate are not very strong or suffer for different bugs. I final开发者_开发问答ly use the good old Google Ajax XSLT without the XSLT part ;)
http://goog-ajaxslt.sourceforge.net/
(so I validate your answer @Cheeso)
By the way a lot of (or all) these libraries are not anymore maintained.
Update again, 28th September 2012:
Google starts another XPath lib project. I dont test it yet but it seems promising and updated. http://code.google.com/p/wicked-good-xpath/
As usual, thanks Microsoft (for explorer 8/9/10) (sic!), please learn to support basic standards and other browsers behaviors.
This is what I use:
// xpath.js
// ------------------------------------------------------------------
//
// a cross-browser xpath class.
// Derived form code at http://jmvidal.cse.sc.edu/talks/javascriptxml/xpathexample.html.
//
// Tested in Chrome, IE9, and FF6.0.2
//
// Author : Dino
// Created : Sun Sep 18 18:39:58 2011
// Last-saved : <2011-September-19 15:07:20>
//
// ------------------------------------------------------------------
/*jshint browser:true */
(function(globalScope) {
'use strict';
/**
* The first argument to this constructor is the text of the XPath expression.
*
* If the expression uses any XML namespaces, the second argument must
* be a JavaScript object that maps namespace prefixes to the URLs that define
* those namespaces. The properties of this object are taken as prefixes, and
* the values associated to those properties are the URLs.
*
* There's no way to specify a non-null default XML namespace. You need to use
* prefixes in order to reference a non-null namespace in a query.
*
*/
var expr = function(xpathText, namespaces) {
var prefix;
this.xpathText = xpathText; // Save the text of the expression
this.namespaces = namespaces || null; // And the namespace mapping
if (document.createExpression) {
this.xpathExpr = true;
// I tried using a compiled xpath expression, it worked on Chrome,
// but it did not work on FF6.0.2. Threw various exceptions.
// So I punt on "compiling" the xpath and just evaluate it.
//
// This flag serves only to store the result of the check.
//
// document.createExpression(xpathText,
// // This function is passed a
// // namespace prefix and returns the URL.
// function(prefix) {
// return namespaces[prefix];
// });
}
else {
// assume IE and convert the namespaces object into the
// textual form that IE requires.
this.namespaceString = "";
if (namespaces !== null) {
for(prefix in namespaces) {
// Add a space if there is already something there
if (this.namespaceString.length>1) this.namespaceString += ' ';
// And add the namespace
this.namespaceString += 'xmlns:' + prefix + '="' +
namespaces[prefix] + '"';
}
}
}
};
/**
* This is the getNodes() method of XPath.Expression. It evaluates the
* XPath expression in the specified context. The context argument should
* be a Document or Element object. The return value is an array
* or array-like object containing the nodes that match the expression.
*/
expr.prototype.getNodes = function(xmlDomCtx) {
var self = this, a, i,
doc = xmlDomCtx.ownerDocument;
// If the context doesn't have ownerDocument, it is the Document
if (doc === null) doc = xmlDomCtx;
if (this.xpathExpr) {
// could not get a compiled XPathExpression to work in FF6
// var result = this.xpathExpr.evaluate(xmlDomCtx,
// // This is the result type we want
// XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
// null);
var result = doc.evaluate(this.xpathText,
xmlDomCtx,
function(prefix) {
return self.namespaces[prefix];
},
XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
null);
// Copy the results into an array.
a = [];
for(i = 0; i < result.snapshotLength; i++) {
a.push(result.snapshotItem(i));
}
return a;
}
else {
// evaluate the expression using the IE API.
try {
// This is IE-specific magic to specify prefix-to-URL mapping
doc.setProperty("SelectionLanguage", "XPath");
doc.setProperty("SelectionNamespaces", this.namespaceString);
// In IE, the context must be an Element not a Document,
// so if context is a document, use documentElement instead
if (xmlDomCtx === doc) xmlDomCtx = doc.documentElement;
// Now use the IE method selectNodes() to evaluate the expression
return xmlDomCtx.selectNodes(this.xpathText);
}
catch(e2) {
throw "XPath is not supported by this browser.";
}
}
};
/**
* This is the getNode() method of XPath.Expression. It evaluates the
* XPath expression in the specified context and returns a single matching
* node (or null if no node matches). If more than one node matches,
* this method returns the first one in the document.
* The implementation differs from getNodes() only in the return type.
*/
expr.prototype.getNode = function(xmlDomCtx) {
var self = this,
doc = xmlDomCtx.ownerDocument;
if (doc === null) doc = xmlDomCtx;
if (this.xpathExpr) {
// could not get compiled "XPathExpression" to work in FF4
// var result =
// this.xpathExpr.evaluate(xmlDomCtx,
// // We just want the first match
// XPathResult.FIRST_ORDERED_NODE_TYPE,
// null);
var result = doc.evaluate(this.xpathText,
xmlDomCtx,
function(prefix) {
return self.namespaces[prefix];
},
XPathResult.FIRST_ORDERED_NODE_TYPE,
null);
return result.singleNodeValue;
}
else {
try {
doc.setProperty("SelectionLanguage", "XPath");
doc.setProperty("SelectionNamespaces", this.namespaceString);
if (xmlDomCtx == doc) xmlDomCtx = doc.documentElement;
return xmlDomCtx.selectSingleNode(this.xpathText);
}
catch(e) {
throw "XPath is not supported by this browser.";
}
}
};
var getNodes = function(context, xpathExpr, namespaces) {
return (new globalScope.XPath.Expression(xpathExpr, namespaces)).getNodes(context);
};
var getNode = function(context, xpathExpr, namespaces) {
return (new globalScope.XPath.Expression(xpathExpr, namespaces)).getNode(context);
};
/**
* XPath is a global object, containing three members. The
* Expression member is a class modelling an Xpath expression. Use
* it like this:
*
* var xpath1 = new XPath.Expression("/kml/Document/Folder");
* var nodeList = xpath1.getNodes(xmldoc);
*
* var xpath2 = new XPath.Expression("/a:kml/a:Document",
* { a : 'http://www.opengis.net/kml/2.2' });
* var node = xpath2.getNode(xmldoc);
*
* The getNodes() and getNode() methods are just utility methods for
* one-time use. Example:
*
* var oneNode = XPath.getNode(xmldoc, '/root/favorites');
*
* var nodeList = XPath.getNodes(xmldoc, '/x:derp/x:twap', { x: 'urn:0190djksj-xx'} );
*
*/
// place XPath into the global scope.
globalScope.XPath = {
Expression : expr,
getNodes : getNodes,
getNode : getNode
};
}(this));
You can use the same code in all browsers, though it is not document.evaluate()
, not directly. Instead you use it like this:
var xpath = new XPath.Expression("/a:kml/a:Document",
{ a : 'http://www.opengis.net/kml/2.2' });
var node = xpath.getNode(xmldoc);
http://blogs.msdn.com/b/dareobasanjo/archive/2004/04/20/116815.aspx
I think that should do it.
--
Appologies, I think this website is actually exactly what you're looking for: http://www.dashop.de/blog/en/dev/JavaScript/content/XPath/JavaScript-XPath-Implementation.html
Depending on what you need, you could find MochiKit's Selector API useful: http://mochi.github.com/mochikit/doc/html/MochiKit/Selector.html
It does all I've also used xpath for, and it's pretty lightweight and works on all major browsers.
Here is the most recent cross-browser implementation of XPath in Javascript: https://github.com/andrejpavlovic/xpathjs
It is fully functional and unit tested, and has great support. The coolest part is that it also supports namespaces!
精彩评论