Using jQuery to select custom tags similar to fbml

Question

FBML uses type tags <fb:like></fb:like> <fb:board></fb:board>, etc.

How do they choose them? I tried $('fb')and $('fb:like'), both return an empty object ... does anyone know how this can be done for and?

Answer 1

eg,

<fb:like href="http://google.com" layout="box_count" show_faces="false" width="450"></fb:like>

quoted2

/*

If you wish to use any of the meta-characters 
( such as !"#$%&'()*+,./:;?@[\]^`{|}~ ) as a literal part of a name, 
you must escape the character with two backslashes: \\. For example, 
if you have an an element with id="foo.bar", you can use the selector 
$("#foo\\.bar"). 

*/

demonstration

Answer 2

Your problem may be that jQuery does not use the "* NS" flavor of DOM selectors (for example, getElementsByTagNamecompared to getElementsByTagNameNS).

I wrote hack some time ago for imbuing jQuery with this feature (especially for XHTML context). Perhaps you can adapt it to your needs:

https://gist.github.com/352210

/**
* Hack to allow jQuery to work within XHTML documents that define an xmlns
*/

/**
* Use the given object to override the given methods in its prototype
* with namespace-aware equivalents
*/
function addNS(obj, methods) {
    var proto = obj.constructor.prototype;
    var ns = document.documentElement.namespaceURI;

    for (var methodName in methods) {
        (function () {
            var methodNS = proto[methodName + "NS"];

            if (methodNS) {
                proto[methodName] = function () {
                    var args = Array.prototype.slice.call(arguments, 0);
                    args.unshift(ns);
                    return methodNS.apply(this, args);
                };
            }
        })();
    }
}

// Play nice with IE -- who doesn't need this hack in the first place
if (document.constructor) {
    // Override document methods that are used by jQuery
    addNS(document, {
        createElement: 1,
        getElementsByTagName: 1
    });

    // Override element methods that are used by jQuery
    addNS(document.createElement("div"), {
        getElementsByTagName: 1,
        getAttribute: 1,
        getAttributeNode: 1,
        removeAttribute: 1,
        setAttribute: 1
    });
}