If you want to select attribute nodes with a namespace in your XHTML, DomQuery does not support namespaces as an option to do so. But by adding a small snippet of code to DomQuery, we can make it do so.

As a standalone snippet executed after DomQuery is loaded.

Ext.DomQuery.matchers.push( {
	re: /^(?:([\[\{])(?:@)?([\w-]+(?:\:[\w-]+))\s?(?:(=|.=)\s?['"]?(.*?)["']?)?[\]\}])/,
	select: 'n = byAttribute(n, "{2}", "{4}", "{3}", "{1}");'
} );

OR by adding an array entry into the DomQuery code matchers array (paste after line 479 of the 17 January 2007 2:26:32 PM version)

,{
	re: /^(?:([\[\{])(?:@)?([\w-]+(?:\:[\w-]+))\s?(?:(=|.=)\s?['"]?(.*?)["']?)?[\]\}])/,
	select: 'n = byAttribute(n, "{2}", "{4}", "{3}", "{1}");'
}

I did not modify the existing matcher for attribute selection because I didn’t want to modify the speed of the existing code for non-namespaced attributes. So by appending another entry to the end of the array, it’ll be used as a last resort if the other entries aren’t matched.

This approach relies on the assumption that when selecting an attribute with getAttribute, the browser interprets any namespace automatically: getAttribute(‘myNamespace:myAttributeName’), as documented by the peterned weblog. This was tested in Firefox 2 and IE 6.

Usage:

Ext.query( '#test-data span[myNameSpace:myAttribute=myValue]' );

on the following DOM

<div id="test-data">
<span myNameSpace:myAttribute="myValue"></span>
</div>

Other notes regarding DomQuery:

To select a node with a non-empty attribute value:

Ext.query( '#test-data span[myNameSpace:myAttribute]' );